@affiliateo/web 4.9.0 → 4.9.2

package/README.md

@@ -233,7 +233,8 @@ signs in next (or nobody) isn't counted as the person who just left. Their Live
 Chat goes too: the next person to open the chat starts a new thread.
 Everything already recorded stays with them. Tracking carries on as before:
 same visitor id, same affiliate. If a different user signs in without a
-sign-out in between, the browser switches to them on its own.
+sign-out in between, the browser switches to them on its own, and the last
+person's Live Chat thread is forgotten first.
 
 ## Live Chat
 
@@ -254,7 +255,7 @@ import { openChat } from '@affiliateo/web'
 // Never load the chat
 <AffiliateoProvider appId="..." chat={false}>
 
-// Your own look, over the dashboard's (4.15.0); leave out what the dashboard should decide
+// Your own look, over the dashboard's (4.9.0); leave out what the dashboard should decide
 <AffiliateoProvider appId="..." chatLook={{ color: '#7C3AED', iconColor: '#FFFFFF', sendColor: '#007AFF', placeholder: 'Ask us anything', style: 'glass', corner: 'bottom-left', size: 56 }}>
 ```
 
@@ -269,6 +270,18 @@ the script tag, `data-chat-color`, `data-chat-icon-color`, `data-chat-send-color
 
 ## Changelog
 
+- **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
+  anonymous keeps the person's own thread. With it, from the bubble itself
+  (chat.js, served by Affiliateo, so every site gets it with no update): its
+  screen-reader labels in the visitor's language, the visitor's chat key no
+  longer in the live connection's address (a one-minute ticket instead), only
+  the page's address without its query or fragment sent to the inbox, and a
+  size set in code kept within 40 to 80.
+
 - **4.9.0:** Live Chat (see above): the chat bubble loads by itself once the
   business switches it on; new `chat` prop and `openChat()`, `closeChat()`,
   `showChatBubble()`, `hideChatBubble()`. `logout()` and `reset()` forget the

package/dist/chat.d.ts

@@ -18,6 +18,12 @@ export interface LoadLiveChatOptions {
     visitorId: string | null;
     /** The signed-in user id from identify(). Null while opted out. */
     userId: string | null;
+    /**
+     * Read again just before chat.js is added (4.9.1): a sign-in or a switch
+     * of person while the config check is on its way must not load the bubble
+     * with the last person's id. Falls back to `userId`.
+     */
+    getUserId?: () => string | null;
     /** 'hidden' loads the chat without a bubble, for a site that opens it from its own button. */
     bubble?: 'visible' | 'hidden';
     theme?: 'light' | 'dark';
@@ -34,6 +40,13 @@ export declare function closeChat(): void;
 export declare function showChatBubble(): void;
 /** Hide the chat bubble, and close the window. */
 export declare function hideChatBubble(): void;
+/**
+ * Who is signed in now (identify(), 4.9.1). chat.js reads the user once, when
+ * it loads: a sign-in after that reaches it through __setUser, which also
+ * forgets a DIFFERENT person's thread (signing in from anonymous keeps it).
+ * Still loading: it reads data-user when it runs, so that is updated.
+ */
+export declare function setLiveChatUser(userId: string): void;
 /**
  * The person signed out (logout(), reset()): their chat goes, so whoever
  * signs in next starts a new thread. The token chat.js keeps goes from

package/dist/chat.js

@@ -54,8 +54,9 @@ export function loadLiveChat(opts) {
         script.setAttribute('data-app', opts.appId);
         if (opts.visitorId)
             script.setAttribute('data-visitor', opts.visitorId);
-        if (opts.userId)
-            script.setAttribute('data-user', opts.userId.slice(0, 128));
+        const userId = opts.getUserId ? opts.getUserId() : opts.userId;
+        if (userId)
+            script.setAttribute('data-user', userId.slice(0, 128));
         if (opts.bubble === 'hidden')
             script.setAttribute('data-bubble', 'hidden');
         if (opts.theme)
@@ -96,6 +97,22 @@ export function showChatBubble() {
 export function hideChatBubble() {
     chatGlobal()?.hide?.();
 }
+/**
+ * Who is signed in now (identify(), 4.9.1). chat.js reads the user once, when
+ * it loads: a sign-in after that reaches it through __setUser, which also
+ * forgets a DIFFERENT person's thread (signing in from anonymous keeps it).
+ * Still loading: it reads data-user when it runs, so that is updated.
+ */
+export function setLiveChatUser(userId) {
+    if (typeof window === 'undefined' || typeof document === 'undefined')
+        return;
+    const chat = chatGlobal();
+    if (chat?.__setUser) {
+        chat.__setUser(userId);
+        return;
+    }
+    document.querySelector('script[data-affiliateo-chat]')?.setAttribute('data-user', userId.slice(0, 128));
+}
 /**
  * The person signed out (logout(), reset()): their chat goes, so whoever
  * signs in next starts a new thread. The token chat.js keeps goes from

package/dist/provider.js

@@ -6,7 +6,7 @@ import { isLikelyBot } from './bot-detect';
 import { isDevHost } from './dev-host';
 import { mintTurnstileToken, consumeTurnstileToken } from './turnstile';
 import { usableUserId } from './user-id';
-import { forgetLiveChat, loadLiveChat } from './chat';
+import { forgetLiveChat, loadLiveChat, setLiveChatUser } from './chat';
 const DEFAULT_API_URL = 'https://affiliateo.com';
 const LS_VISITOR_ID = 'affiliateo_visitor_id';
 const LS_REF = 'affiliateo_ref';
@@ -336,7 +336,15 @@ export function AffiliateoProvider({ appId, campaignId, apiUrl, allowedHostnames
                 log('identify skipped: not a user id (empty, over 128 characters, or a placeholder like "null", "guest" or "0")', { user_id: userId });
                 return;
             }
+            // A DIFFERENT person signing in on this browser (4.9.1): the last
+            // person's Live Chat thread was theirs, so it goes first, as on a
+            // sign-out. Signing in from anonymous keeps it (the same person who
+            // was writing). chat.js is told who is signed in now either way.
+            const previous = usableUserId(lsGet(LS_USER_ID));
+            if (previous && previous !== uid)
+                forgetLiveChat(appIdRef.current);
             lsSet(LS_USER_ID, uid);
+            setLiveChatUser(uid);
             const cid = appIdRef.current;
             const vid = visitorIdRef.current;
             const queue = queueRef.current;
@@ -1042,6 +1050,8 @@ export function AffiliateoProvider({ appId, campaignId, apiUrl, allowedHostnames
             appId: resolvedAppId,
             visitorId: optedOut ? null : visitorIdRef.current ?? lsGet(LS_VISITOR_ID),
             userId: optedOut ? null : usableUserId(lsGet(LS_USER_ID)),
+            // Read again when the bubble is added: a sign-in meanwhile counts.
+            getUserId: () => (isOptedOut() ? null : usableUserId(lsGet(LS_USER_ID))),
             bubble: chat === 'hidden' ? 'hidden' : 'visible',
             look: chatLook,
             log,

package/dist/queue.js

@@ -46,6 +46,10 @@ 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';
 function lsGet(key) {
     try {
         return localStorage.getItem(key);
@@ -188,7 +192,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.
@@ -243,7 +247,7 @@ export class EventQueue {
                 try {
                     fetch(event.endpoint, {
                         method: 'POST',
-                        headers: { 'Content-Type': 'application/json' },
+                        headers: { 'Content-Type': BODY_TYPE },
                         body: JSON.stringify(event.payload),
                         keepalive: true,
                     }).catch(() => { });
@@ -256,7 +260,7 @@ export class EventQueue {
         }
         for (const event of this.queue) {
             try {
-                navigator.sendBeacon(event.endpoint, new Blob([JSON.stringify(event.payload)], { type: 'application/json' }));
+                navigator.sendBeacon(event.endpoint, new Blob([JSON.stringify(event.payload)], { type: BODY_TYPE }));
             }
             catch { /* swallow */ }
         }

package/package.json

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