@affiliateo/web 4.9.1 → 4.9.3

package/README.md

@@ -270,6 +270,12 @@ the script tag, `data-chat-color`, `data-chat-icon-color`, `data-chat-send-color
 
 ## Changelog
 
+- **4.9.3:** the events still waiting when a page closes now reach Affiliateo
+  on websites with strict privacy settings too (a referrer policy of
+  `no-referrer` or `same-origin`, the defaults of Helmet and Django). Nothing
+  to change in your code.
+- **4.9.2:** events are sent as plain text, so the browser no longer makes an
+  extra check request before each one. Nothing to change in your code.
 - **4.9.1:** a different user signing in with `identify()` (no `logout()` in
   between) now forgets the last person's Live Chat thread first, as a sign-out
   does, and the bubble learns the new user without a reload. Signing in from

package/dist/queue.d.ts

@@ -84,15 +84,15 @@ export declare class EventQueue {
      *  burst path + the timer firing simultaneously) only run one
      *  flush at a time. */
     flush(): Promise<void>;
-    /** Best-effort sync flush triggered on page unload. Uses sendBeacon
-     *  for each event so it survives the tab closing. No retry - this is
-     *  the last chance.
+    /** Best-effort sync flush triggered on page unload: each event goes out
+     *  in a way that survives the tab closing (sendAtUnload). No retry - this
+     *  is the last chance.
      *
      *  Called from the provider's pagehide / visibilitychange=hidden
      *  handlers so any events still queued at unload get one last shot.
-     *  After this call, the in-memory queue is cleared (events that
-     *  sendBeacon couldn't queue are lost - that's the cost of the
-     *  guaranteed-fast unload path). */
+     *  After this call, the in-memory queue is cleared (events the browser
+     *  couldn't take are lost - that's the cost of the guaranteed-fast
+     *  unload path). */
     flushOnUnload(): void;
     /** Remove the queued events `predicate` picks (4.8.0). A sign-in uses it
      *  to drop a sign-out still waiting to be delivered: the sign-in replaces

package/dist/queue.js

@@ -46,6 +46,36 @@ const MAX_RETRIES = 3;
 const DEFAULT_MAX_QUEUE_SIZE = 100;
 const DEFAULT_FLUSH_INTERVAL_MS = 5000;
 const SIZE_FLUSH_THRESHOLD = 10;
+// Plain text, not application/json: a JSON body makes the browser send an
+// extra OPTIONS request before every event. The server reads the body as
+// text and parses it itself, so nothing else changes.
+const BODY_TYPE = 'text/plain;charset=UTF-8';
+/** Whether a fetch here outlives the page (keepalive; Firefox only since 133). */
+const KEEPALIVE_FETCH = typeof Request === 'function' && 'keepalive' in Request.prototype;
+/**
+ * One last send as the page goes away. A fetch in CORS mode with keepalive,
+ * not sendBeacon: a plain-text beacon goes out as no-cors, and on a site
+ * whose referrer policy is no-referrer or same-origin (Helmet's and Django's
+ * defaults) the browser then sends "Origin: null", which the server refuses,
+ * since it takes events only from the app's own site. A CORS fetch always
+ * carries the real Origin, is still a simple request (no OPTIONS), and
+ * keepalive lets it outlive the page the way a beacon does. Browsers without
+ * keepalive keep the beacon (4.9.3). Same in t.js (public/t.js, post()).
+ */
+function sendAtUnload(endpoint, body) {
+    try {
+        if (KEEPALIVE_FETCH) {
+            fetch(endpoint, { method: 'POST', mode: 'cors', credentials: 'omit', headers: { 'Content-Type': BODY_TYPE }, body, keepalive: true }).catch(() => { });
+            return;
+        }
+        if (typeof navigator !== 'undefined' && navigator.sendBeacon && navigator.sendBeacon(endpoint, new Blob([body], { type: BODY_TYPE })))
+            return;
+        fetch(endpoint, { method: 'POST', headers: { 'Content-Type': BODY_TYPE }, body, keepalive: true }).catch(() => { });
+    }
+    catch {
+        // The last chance: nothing left to do.
+    }
+}
 function lsGet(key) {
     try {
         return localStorage.getItem(key);
@@ -188,7 +218,7 @@ export class EventQueue {
             try {
                 const res = await fetch(event.endpoint, {
                     method: 'POST',
-                    headers: { 'Content-Type': 'application/json' },
+                    headers: { 'Content-Type': BODY_TYPE },
                     body: JSON.stringify(event.payload),
                     // keepalive lets the request survive a navigation. paired
                     // with the queue so even if this fetch errors, we'll retry.
@@ -223,43 +253,20 @@ export class EventQueue {
         this.persist();
         this.isFlushing = false;
     }
-    /** Best-effort sync flush triggered on page unload. Uses sendBeacon
-     *  for each event so it survives the tab closing. No retry - this is
-     *  the last chance.
+    /** Best-effort sync flush triggered on page unload: each event goes out
+     *  in a way that survives the tab closing (sendAtUnload). No retry - this
+     *  is the last chance.
      *
      *  Called from the provider's pagehide / visibilitychange=hidden
      *  handlers so any events still queued at unload get one last shot.
-     *  After this call, the in-memory queue is cleared (events that
-     *  sendBeacon couldn't queue are lost - that's the cost of the
-     *  guaranteed-fast unload path). */
+     *  After this call, the in-memory queue is cleared (events the browser
+     *  couldn't take are lost - that's the cost of the guaranteed-fast
+     *  unload path). */
     flushOnUnload() {
         if (this.queue.length === 0)
             return;
-        if (typeof navigator === 'undefined' || !navigator.sendBeacon) {
-            // No sendBeacon (very old browser) - try a sync fetch with
-            // keepalive as a fallback. Won't actually finish, but it's our
-            // last shot.
-            for (const event of this.queue) {
-                try {
-                    fetch(event.endpoint, {
-                        method: 'POST',
-                        headers: { 'Content-Type': 'application/json' },
-                        body: JSON.stringify(event.payload),
-                        keepalive: true,
-                    }).catch(() => { });
-                }
-                catch { /* swallow */ }
-            }
-            this.queue = [];
-            this.persist();
-            return;
-        }
-        for (const event of this.queue) {
-            try {
-                navigator.sendBeacon(event.endpoint, new Blob([JSON.stringify(event.payload)], { type: 'application/json' }));
-            }
-            catch { /* swallow */ }
-        }
+        for (const event of this.queue)
+            sendAtUnload(event.endpoint, JSON.stringify(event.payload));
         this.queue = [];
         this.persist();
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@affiliateo/web",
-  "version": "4.9.1",
+  "version": "4.9.3",
   "description": "Affiliateo web SDK: affiliate attribution and tracking for web apps",
   "main": "dist/index.js",
   "module": "dist/index.js",