anys-web 6.3.2 → 6.4.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "anys-web",
-  "version": "6.3.2",
+  "version": "6.4.0",
   "description": "",
   "main": "src/index.js",
   "type": "module",
@@ -12,25 +12,27 @@
   "author": "tangshuang",
   "license": "Apache-2.0",
   "dependencies": {
-    "anys": "^6.3.0",
-    "anys-shared": "^6.3.0",
-    "anys-web-plugin-identify": "^6.2.0",
-    "anys-web-plugin-monitor-ajax": "^6.3.0",
-    "anys-web-plugin-monitor-dom-mutation": "^6.3.2",
-    "anys-web-plugin-monitor-error": "^6.3.1",
-    "anys-web-plugin-monitor-input-event": "^6.3.0",
-    "anys-web-plugin-monitor-mouse-event": "^6.3.0",
-    "anys-web-plugin-monitor-performance": "^6.3.0",
-    "anys-web-plugin-monitor-scroll-event": "^6.3.0",
-    "anys-web-plugin-monitor-touch-event": "^6.3.0",
-    "anys-web-plugin-monitor-url": "^6.3.0",
-    "anys-web-plugin-monitor-window-activity": "^6.3.0",
-    "anys-web-plugin-monitor-window-size": "^6.3.0",
-    "anys-web-plugin-send-by-ajax": "^6.3.0",
-    "anys-web-plugin-store-offline": "^6.3.0"
+    "anys": "^6.4.0",
+    "anys-plugin-store-memory": "^6.4.0",
+    "anys-shared": "^6.4.0",
+    "anys-web-plugin-identify": "^6.4.0",
+    "anys-web-plugin-monitor-ajax": "^6.4.0",
+    "anys-web-plugin-monitor-dom-mutation": "^6.4.0",
+    "anys-web-plugin-monitor-error": "^6.4.0",
+    "anys-web-plugin-monitor-input-event": "^6.4.0",
+    "anys-web-plugin-monitor-mouse-event": "^6.4.0",
+    "anys-web-plugin-monitor-performance": "^6.4.0",
+    "anys-web-plugin-monitor-scroll-event": "^6.4.0",
+    "anys-web-plugin-monitor-touch-event": "^6.4.0",
+    "anys-web-plugin-monitor-url": "^6.4.0",
+    "anys-web-plugin-monitor-window-activity": "^6.4.0",
+    "anys-web-plugin-monitor-window-size": "^6.4.0",
+    "anys-web-plugin-send-by-ajax": "^6.4.0",
+    "anys-web-plugin-send-by-beacon": "^6.4.0",
+    "anys-web-plugin-store-offline": "^6.4.0"
   },
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
   },
-  "gitHead": "c0f2dddfe6873acf138eb88111a02435147eecb2"
+  "gitHead": "b917a175c4434546544756f32d7b71102d058162"
 }

package/src/index.js

@@ -1,5 +1,5 @@
 import { Anys } from 'anys';
-import { AnysTracePlugin } from './tracer-plugin.js';
+import { AnysOfflineTracerPlugin } from './offline-tracer-plugin.js';
 
 class Tracer extends Anys {
     /**
@@ -16,6 +16,6 @@ export const createTracer = (options = {}) => new Tracer({
     ...options,
     plugins: {
         ...(options.plugins || {}),
-        tracer: AnysTracePlugin,
+        tracer: AnysOfflineTracerPlugin,
     },
 });

package/src/offline-tracer-plugin.js

@@ -0,0 +1,159 @@
+import { AnysPlugin, ajaxPost, replaceUrlSearch } from 'anys-shared';
+import { AnysIdentifyPlugin } from 'anys-web-plugin-identify';
+import { AnysMonitorInputEventPlugin } from 'anys-web-plugin-monitor-input-event';
+import { AnysMonitorMouseEventPlugin } from 'anys-web-plugin-monitor-mouse-event';
+import { AnysMonitorWindowActivityPlugin } from 'anys-web-plugin-monitor-window-activity';
+import { AnysMonitorUrlPlugin } from 'anys-web-plugin-monitor-url';
+import { AnysMonitorTouchEventPlugin } from 'anys-web-plugin-monitor-touch-event';
+import { AnysStoreOfflinePlugin } from 'anys-web-plugin-store-offline';
+import { AnysMonitorDOMMutationPlugin } from 'anys-web-plugin-monitor-dom-mutation';
+import { AnysMonitorWindowSizePlugin } from 'anys-web-plugin-monitor-window-size';
+import { AnysMonitorScrollEventPlugin } from 'anys-web-plugin-monitor-scroll-event';
+
+export class AnysOfflineTracerPlugin extends AnysPlugin {
+    static dependencies = [
+        AnysStoreOfflinePlugin,
+        AnysMonitorUrlPlugin,
+        AnysMonitorWindowSizePlugin,
+        AnysMonitorDOMMutationPlugin,
+        AnysIdentifyPlugin,
+        AnysMonitorInputEventPlugin,
+        AnysMonitorMouseEventPlugin,
+        AnysMonitorWindowActivityPlugin,
+        AnysMonitorTouchEventPlugin,
+        AnysMonitorScrollEventPlugin,
+    ];
+
+    constructor(anys, [offlineStore, urlMonitor, windowSizeMonitor, DOMMutationMonitor]) {
+        super(anys);
+        this.offlineStore = offlineStore;
+        this.urlMonitor = urlMonitor;
+        this.windowSizeMonitor = windowSizeMonitor;
+        this.DOMMutationMonitor = DOMMutationMonitor;
+        // cache for trace logs to be send by beacon
+        this.cache = {};
+    }
+
+    options() {
+        const isSupportTouch = 'ontouchend' in document;
+        return {
+            touch: isSupportTouch,
+            mouse: !isSupportTouch,
+            click: false,
+            mousedown: true,
+            mousemove: true,
+            mouseup: true,
+            autoReport: false,
+            reportUrl: new Error('options.reportUrl is required!'),
+            reportInterval: 10000,
+            reportParams: null,
+        };
+    }
+
+    registerAutoReport() {
+        const { clientId } = this.anys;
+        const autoReportWhenRefreshTraceId = ({ prev }) => {
+            // report previous trace logs
+            this.anys.report([
+                { key: 'client', value: clientId },
+                { key: 'trace', value: prev },
+            ]);
+
+            // clear cache
+            this.cache = {};
+
+            // record new information
+            this.urlMonitor.recordUrl();
+            this.windowSizeMonitor.recordSize();
+            this.DOMMutationMonitor.recordSnapshot();
+        };
+        this.anys.on('refreshTraceId', autoReportWhenRefreshTraceId);
+
+        const timer = setInterval(() => {
+            this.anys.report();
+        }, this.anys.options.reportInterval);
+
+        let isUnloaded = 0;
+        const sendBeaconWhenBeforeUnload = () => {
+            if (isUnloaded) {
+                return;
+            }
+            isUnloaded = 1;
+
+            const ids = Object.keys(this.cache);
+            const logs = { data: Object.values(this.cache), by: 'beacon' };
+            if (ids.length) {
+                this.offlineStore.remove(ids); // async may not executed
+                navigator.sendBeacon(this.anys.options.reportUrl, JSON.stringify(logs));
+                this.cache = {};
+            }
+        };
+        window.addEventListener('beforeunload', sendBeaconWhenBeforeUnload);
+        window.addEventListener('pagehide', sendBeaconWhenBeforeUnload); // 兼容微信浏览器
+        window.addEventListener('unload', sendBeaconWhenBeforeUnload);
+
+        const addCacheWhenWriteLog = ({ id, data }) => {
+            this.cache[id] = data;
+        };
+        this.anys.on('writeOfflineLog', addCacheWhenWriteLog);
+
+        return () => {
+            this.anys.off('refreshTraceId', autoReportWhenRefreshTraceId);
+            this.anys.off('writeOfflineLog', addCacheWhenWriteLog);
+            // @ts-ignore
+            clearInterval(timer);
+            window.removeEventListener('beforeunload', sendBeaconWhenBeforeUnload);
+        };
+    }
+
+    /**
+     * define read here, so that recorder will not send other plugins 'read' output
+     * @param {*} message
+     * @returns
+     */
+    read(message) {
+        return this.offlineStore.read(message);
+    }
+
+    arrange(logs) {
+        const groups = [];
+        let i = 0;
+
+        logs.forEach((item) => {
+            groups[i] = groups[i] || [];
+            groups[i].push(item);
+            if (groups[i].length > 200) {
+                i ++;
+            }
+        });
+
+        return groups;
+    }
+
+    send(data) {
+        const items = [];
+        const ids = [];
+
+        data.forEach((item) => {
+            const { _id, ...info } = item;
+            ids.push(_id);
+            items.push(info);
+        });
+
+        if (!items.length) {
+            return;
+        }
+
+        const { reportUrl, reportParams } = this.anys.options;
+        const url = reportParams ? replaceUrlSearch(reportUrl, reportParams) : reportUrl;
+        return ajaxPost(url, { data: items }).then(() => {
+            ids.forEach((id) => {
+                delete this.cache[id];
+            });
+        });
+    }
+
+    clear() {
+        this.cache = {};
+    }
+}

package/src/tracer-plugin.js

@@ -1,18 +1,18 @@
-import { AnysPlugin, ajaxPost, replaceUrlSearch } from 'anys-shared';
+import { AnysPlugin } from 'anys-shared';
 import { AnysIdentifyPlugin } from 'anys-web-plugin-identify';
 import { AnysMonitorInputEventPlugin } from 'anys-web-plugin-monitor-input-event';
 import { AnysMonitorMouseEventPlugin } from 'anys-web-plugin-monitor-mouse-event';
 import { AnysMonitorWindowActivityPlugin } from 'anys-web-plugin-monitor-window-activity';
 import { AnysMonitorUrlPlugin } from 'anys-web-plugin-monitor-url';
 import { AnysMonitorTouchEventPlugin } from 'anys-web-plugin-monitor-touch-event';
-import { AnysStoreOfflinePlugin } from 'anys-web-plugin-store-offline';
 import { AnysMonitorDOMMutationPlugin } from 'anys-web-plugin-monitor-dom-mutation';
 import { AnysMonitorWindowSizePlugin } from 'anys-web-plugin-monitor-window-size';
 import { AnysMonitorScrollEventPlugin } from 'anys-web-plugin-monitor-scroll-event';
+import { AnysStoreMemoryPlugin } from 'anys-plugin-store-memory';
+import { AnysSendByBeaconPlugin } from 'anys-web-plugin-send-by-beacon';
 
-export class AnysTracePlugin extends AnysPlugin {
+export class AnysTracerPlugin extends AnysPlugin {
     static dependencies = [
-        AnysStoreOfflinePlugin,
         AnysMonitorUrlPlugin,
         AnysMonitorWindowSizePlugin,
         AnysMonitorDOMMutationPlugin,
@@ -22,18 +22,10 @@ export class AnysTracePlugin extends AnysPlugin {
         AnysMonitorWindowActivityPlugin,
         AnysMonitorTouchEventPlugin,
         AnysMonitorScrollEventPlugin,
+        AnysStoreMemoryPlugin,
+        AnysSendByBeaconPlugin,
     ];
 
-    constructor(anys, [offlineStore, urlMonitor, windowSizeMonitor, DOMMutationMonitor]) {
-        super(anys);
-        this.offlineStore = offlineStore;
-        this.urlMonitor = urlMonitor;
-        this.windowSizeMonitor = windowSizeMonitor;
-        this.DOMMutationMonitor = DOMMutationMonitor;
-        // cache for trace logs to be send by beacon
-        this.cache = {};
-    }
-
     options() {
         const isSupportTouch = 'ontouchend' in document;
         return {
@@ -43,36 +35,14 @@ export class AnysTracePlugin extends AnysPlugin {
             mousedown: true,
             mousemove: true,
             mouseup: true,
-            autoReport: false,
+            autoReport: true,
             reportUrl: new Error('options.reportUrl is required!'),
-            reportInterval: 10000,
+            reportInterval: 5000,
             reportParams: null,
         };
     }
 
     registerAutoReport() {
-        const { clientId } = this.anys;
-        const autoReportWhenRefreshTraceId = ({ prev }) => {
-            // report previous trace logs
-            this.anys.report([
-                { key: 'client', value: clientId },
-                { key: 'trace', value: prev },
-            ]);
-
-            // clear cache
-            this.cache = {};
-
-            // record new information
-            this.urlMonitor.recordUrl();
-            this.windowSizeMonitor.recordSize();
-            this.DOMMutationMonitor.recordSnapshot();
-        };
-        this.anys.on('refreshTraceId', autoReportWhenRefreshTraceId);
-
-        const timer = setInterval(() => {
-            this.anys.report();
-        }, this.anys.options.reportInterval);
-
         let isUnloaded = 0;
         const sendBeaconWhenBeforeUnload = () => {
             if (isUnloaded) {
@@ -80,80 +50,14 @@ export class AnysTracePlugin extends AnysPlugin {
             }
             isUnloaded = 1;
 
-            const ids = Object.keys(this.cache);
-            const logs = { data: Object.values(this.cache), by: 'beacon' };
-            if (ids.length) {
-                this.offlineStore.remove(ids); // async may not executed
-                navigator.sendBeacon(this.anys.options.reportUrl, JSON.stringify(logs));
-                this.cache = {};
-            }
+            this.anys.report();
         };
         window.addEventListener('beforeunload', sendBeaconWhenBeforeUnload);
         window.addEventListener('pagehide', sendBeaconWhenBeforeUnload); // 兼容微信浏览器
         window.addEventListener('unload', sendBeaconWhenBeforeUnload);
 
-        const addCacheWhenWriteLog = ({ id, data }) => {
-            this.cache[id] = data;
-        };
-        this.anys.on('writeOfflineLog', addCacheWhenWriteLog);
-
         return () => {
-            this.anys.off('refreshTraceId', autoReportWhenRefreshTraceId);
-            this.anys.off('writeOfflineLog', addCacheWhenWriteLog);
-            // @ts-ignore
-            clearInterval(timer);
             window.removeEventListener('beforeunload', sendBeaconWhenBeforeUnload);
         };
     }
-
-    /**
-     * define read here, so that recorder will not send other plugins 'read' output
-     * @param {*} message
-     * @returns
-     */
-    read(message) {
-        return this.offlineStore.read(message);
-    }
-
-    arrange(logs) {
-        const groups = [];
-        let i = 0;
-
-        logs.forEach((item) => {
-            groups[i] = groups[i] || [];
-            groups[i].push(item);
-            if (groups[i].length > 200) {
-                i ++;
-            }
-        });
-
-        return groups;
-    }
-
-    send(data) {
-        const items = [];
-        const ids = [];
-
-        data.forEach((item) => {
-            const { _id, ...info } = item;
-            ids.push(_id);
-            items.push(info);
-        });
-
-        if (!items.length) {
-            return;
-        }
-
-        const { reportUrl, reportParams } = this.anys.options;
-        const url = reportParams ? replaceUrlSearch(reportUrl, reportParams) : reportUrl;
-        return ajaxPost(url, { data: items }).then(() => {
-            ids.forEach((id) => {
-                delete this.cache[id];
-            });
-        });
-    }
-
-    clear() {
-        this.cache = {};
-    }
 }