@tmsfe/tms-core 0.0.40 → 0.0.41

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tmsfe/tms-core",
-  "version": "0.0.40",
+  "version": "0.0.41",
   "description": "tms运行时框架",
   "repository": {
     "type": "git",

package/src/index-proxy.js

@@ -6,6 +6,7 @@
  */
 
 import syncApi from './syncfnmanager';
+import AutoReport from './report/proxy/index';
 import md5 from './md5';
 import { rpxToPx } from './rpx';
 import { serialize } from './objUtils';
@@ -39,6 +40,7 @@ function invoke(obj, funcName, args) {
 function initProxy(appObj, options) {
   app = appObj;
   initOptions = options;
+  AutoReport.init();
 }
 
 function awaitTMS() {

package/src/index.js

@@ -1,4 +1,5 @@
 import Request from './request';
+import AutoReport from './report/proxy/index';
 import Reporter from './report/index';
 import { getConfig } from './config';
 import syncApi from './syncfnmanager';
@@ -101,6 +102,7 @@ const init = (options = {}) => {
   setEnvInfo(envInfo);
   setAppPagePaths(appPagePaths, homePage);
   Reporter.init(envInfo);
+  AutoReport.init();
   Request.defaultHost = defaultHost;
   // 初始化云环境
   wx.cloud.init({ env: cloudEnvId });

package/src/report/formatV1.ts

@@ -9,14 +9,15 @@ import helper from './helper';
  * 获取埋点的基础字段
  */
 function getBaseData(deviceData: IDeviceData): DataItem[] {
-  const arr = new Array<string>(helper.dataArrLen);
   const { networkType, location } = deviceData;
   const { appVersion, client } = helper.getInitOptions();
   const { host } = helper.getSystemInfo();
+  const arr = new Array<string>(helper.dataArrLen);
   // todo: 如何区分新旧埋点？新：f20不为空，旧：f20为空
   // ++++++++++++++++++++++++++字段列表++++++++++++++++++++++++++
   // 0: log_time，日志入库时间
-  // 1: access_time，用户点击时间，服务端统一处理
+  // 1: access_time，埋点触发时间
+  arr[1] = Date.now().toString();
   // 2: user_ip，前端无需赋值
   // 3: qimei，灯塔中的用户ID
   // 4: imei，Android手机的imei IOS系统中的idfv 车联网中的wecarid
@@ -50,7 +51,7 @@ function getBaseData(deviceData: IDeviceData): DataItem[] {
   arr[29] = helper.getAppScene();
   // 33: f33，系统信息
   arr[33] = helper.getSystemInfoString();
-  // 36: f36，小程序启动时的参数
+  // 36: f36，小程序启动时的url和参数
   arr[36] = helper.getLaunchOptionsString();
   // --------------------------字段列表--------------------------
   return arr;
@@ -84,7 +85,7 @@ function formatData(data: IOldParams): Promise<DataItem[]> {
  * 格式化快速上报埋点数据，不依赖用户位置
  */
 function formatFastData(data: IOldParams): DataItem[] {
-  return jointData(data, helper.defaultDevice);
+  return jointData(data, helper.getCacheDeviceData());
 }
 
 export default {

package/src/report/formatV2.ts

@@ -16,7 +16,8 @@ function getBaseData(deviceData: IDeviceData): { arr: DataItem[], nextIndex: num
   // todo: 如何区分新旧埋点？新：f20不为空，旧：f20为空
   // ++++++++++++++++++++++++++字段列表++++++++++++++++++++++++++
   // 0: log_time，日志入库时间
-  // 1: access_time，用户点击时间，服务端统一处理
+  // 1: access_time，埋点触发时间
+  arr[1] = Date.now().toString();
   // 2: user_ip，前端无需赋值
   // 3: qimei，灯塔中的用户ID
   // 4: imei，Android手机的imei IOS系统中的idfv 车联网中的wecarid
@@ -47,7 +48,7 @@ function getBaseData(deviceData: IDeviceData): { arr: DataItem[], nextIndex: num
   arr[20] = client;
   // 21: f21，小程序场景值
   arr[21] = helper.getAppScene();
-  // 22: f22，小程序启动时的参数
+  // 22: f22，小程序启动时的url和参数
   arr[22] = helper.getLaunchOptionsString();
   // 23: f23，当前页面的url
   arr[23] = page.route;
@@ -92,7 +93,7 @@ function formatData(data: any[]): Promise<DataItem[]> {
  * 格式化快速上报埋点数据，不依赖用户位置
  */
 function formatFastData(data: any[]): DataItem[] {
-  return jointData(data, helper.defaultDevice);
+  return jointData(data, helper.getCacheDeviceData());
 }
 
 export default {

package/src/report/helper.ts

@@ -18,6 +18,16 @@ let initOptions: IInitOptions;
 function init(options: IInitOptions): void {
   if (!initOptions) {
     initOptions = options;
+
+    // 从上次缓存中读取，方便首次Report可以先带上
+    const loc = wx.getStorageSync('home.location_city') || wx.getStorageSync('home.city');
+    deviceData = {
+      networkType: '',
+      location: {
+        province: loc?.province as string,
+        cityName: loc?.cityName as string,
+      },
+    };
   }
 }
 
@@ -95,8 +105,8 @@ let launchOptions: string | null = null;
  */
 function getLaunchOptionsString(): string {
   if (launchOptions === null) {
-    const obj = syncApi.getLaunchOptionsSync() as any;
-    launchOptions = obj.query ? JSON.stringify(obj.query) : '';
+    const obj = syncApi.getLaunchOptionsSync();
+    launchOptions = JSON.stringify(obj);
   }
   return launchOptions;
 }
@@ -106,7 +116,7 @@ function getLaunchOptionsString(): string {
  */
 function getLaunchFrom(): string {
   const obj = syncApi.getLaunchOptionsSync() as any;
-  return obj.query?.from as string || '';
+  return obj.query?.from;
 }
 
 /**
@@ -141,46 +151,8 @@ function canReport(): boolean {
  */
 const dataArrLen = 41;
 
-const defaultDevice = {
-  networkType: null,
-  location: {
-    province: null,
-    cityName: null,
-  },
-} as any as IDeviceData;
-
-let networkPromise: Promise<string> | null = null;
-
-function getNetworkType(): Promise<string> {
-  if (networkPromise === null) {
-    networkPromise = new Promise((resolve) => {
-      wx.getNetworkType({
-        success: (res: any) => resolve(res.networkType),
-        fail: () => resolve('unknown'),
-      });
-    });
-  }
-  return networkPromise;
-}
-
-let locPromise: Promise<ILocation> | null = null;
-
-function getLocation(): Promise<ILocation> {
-  if (locPromise === null) {
-    locPromise = new Promise<ILocation>((resolve) => {
-      const LOC = getTms().getLocationManager();
-      LOC.getIpLocation()
-        .then((res: any) => {
-          const ad = res.ad_info;
-          resolve({ province: ad.province, cityName: ad.city });
-        })
-        .catch(() => {
-          resolve({ province: '', cityName: '' });
-        });
-    });
-  }
-  return locPromise;
-}
+// 缓存设备等信息，方便FastReport使用
+let deviceData: IDeviceData;
 
 let devicePromise: Promise<IDeviceData> | null = null;
 
@@ -190,15 +162,45 @@ let devicePromise: Promise<IDeviceData> | null = null;
 function getDeviceData(): Promise<IDeviceData> {
   if (devicePromise === null) {
     devicePromise = new Promise<IDeviceData>((resolve) => {
-      Promise.all([getNetworkType(), getLocation()]).then((res) => {
-        const [networkType, location] = res;
-        resolve({ networkType, location });
+      const networkPromise = new Promise<void>((resolve) => {
+        wx.getNetworkType({
+          success: (res: any) => {
+            deviceData.networkType = res.networkType;
+            resolve();
+          },
+          fail: () => resolve(),
+        });
       });
+
+      const locPromise = new Promise<void>((resolve) => {
+        // 首次如果有缓存则先用缓存，请求后再更新给下次用
+        if (deviceData.location.province) {
+          resolve();
+        }
+        const LOC = getTms().getLocationManager();
+        LOC.getIpLocation()
+          .then((res: any) => {
+            const ad = res.ad_info;
+            deviceData.location.province = ad.province;
+            deviceData.location.cityName = ad.city;
+            resolve();
+          })
+          .catch(() => resolve());
+      });
+
+      Promise.all([networkPromise, locPromise]).then(() => resolve(deviceData));
     });
   }
   return devicePromise;
 }
 
+/**
+ * 获取缓存的设备信息(网络状况，位置信息)
+ */
+function getCacheDeviceData(): IDeviceData {
+  return deviceData;
+}
+
 export default {
   init,
   getTms,
@@ -212,6 +214,6 @@ export default {
   getAppScene,
   canReport,
   dataArrLen,
-  defaultDevice,
   getDeviceData,
+  getCacheDeviceData,
 };

package/src/report/proxy/component.ts

@@ -0,0 +1,42 @@
+/**
+ * 负责组件的全埋点
+ */
+
+import helper from './helper';
+
+let originalComponent: any = null;
+
+// 劫持其他事件
+function proxyHandle(componentName: string, methods: any, methodName: string): void {
+  const original = methods[methodName];
+  // eslint-disable-next-line no-param-reassign
+  methods[methodName] = function (...args: any[]): any {
+    // 执行原函数之后再发埋点
+    return helper.executeFunc(this, original, args, () => {
+      const data = helper.serializeData(this.data);
+      helper.reportData(`Component_${componentName}`, methodName, data);
+    });
+  };
+}
+
+// 劫持Page
+function init(): void {
+  // @ts-ignore
+  originalComponent = Component;
+  // @ts-ignore
+  Component = function (options: any) {
+    // 只有tms的页面才需要上报
+    if (options.tmsAutoReport) {
+      // tmsReportEvents是由工具在编译时分析出的要上报的事件列表
+      const methods = options.methods || {};
+      for (const name of options.tmsReportEvents) {
+        proxyHandle(options.tmsComponentName, methods, name);
+      }
+    }
+    originalComponent(options);
+  };
+}
+
+export default {
+  init,
+};

package/src/report/proxy/helper.ts

@@ -0,0 +1,133 @@
+/**
+ * 自动埋点辅助类
+ */
+
+let reporter: any = null;
+
+function reportData(...args: any[]): any {
+  if (reporter === null) {
+    // 如果是在app.js的onLaunch中调用，则没有getApp().tms为空
+    // @ts-ignore
+    const tms = getApp()?.tms || wx.tms;
+    reporter = tms.getReporter();
+  }
+  // console.log('自动埋点：', ...args);
+  reporter.report2(...args);
+}
+
+/**
+ * 空函数
+ */
+function emptyFunc(): void {
+}
+
+/**
+ * 执行函数
+ * @param context
+ * @param func
+ * @param args
+ * @param doneCallback
+ */
+function executeFunc(context: any, func: Function, args: any[], doneCallback: Function): any {
+  const value = func.apply(context, args);
+  // 如果不会返回promise
+  if (!value || !value.then || typeof value.then !== 'function') {
+    doneCallback();
+    return value;
+  }
+
+  return value.then((res: any) => {
+    doneCallback();
+    return res;
+  }).catch((err: any) => {
+    doneCallback();
+    return Promise.reject(err);
+  });
+}
+
+const maxDepth = 5;
+const maxArrLen = 10;
+const maxStrLen = 30;
+const maxFieldLen = 20;
+
+function isBasicsType(obj: any): { isBasics: boolean, value: any } {
+  const type = typeof obj;
+  if (obj === null || obj === undefined
+    || type === 'number' || type === 'boolean' || type === 'bigint') {
+    return { isBasics: true, value: obj };
+  }
+  if (type === 'string') {
+    const value = obj.substr(0, maxStrLen);
+    return { isBasics: true, value };
+  }
+  if (type === 'function' || type === 'symbol') {
+    return { isBasics: true, value: undefined };
+  }
+  return { isBasics: false, value: obj };
+}
+
+function isArrayType(obj: any): { isArray: boolean, value: any } {
+  if (Array.isArray(obj)) {
+    const arr = obj.slice(0, maxArrLen);
+    return { isArray: true, value: arr };
+  }
+  return { isArray: false, value: obj };
+}
+
+/**
+ * 深表克隆
+ * @param obj
+ * @param depth 当前克隆的深度
+ */
+function deepClone(obj: any, depth: number): any {
+  if (depth >= maxDepth) {
+    return undefined;
+  }
+  const res1 = isBasicsType(obj);
+  if (res1.isBasics) {
+    return res1.value;
+  }
+  const res2 = isArrayType(obj);
+  if (res2.isArray) {
+    return res2.value.map((t: any) => deepClone(t, depth + 1));
+  }
+  const names = Object.getOwnPropertyNames(obj).slice(0, maxFieldLen);
+  const newObj = {};
+  for (const name of names) {
+    if (name === '__webviewId__') {
+      continue;
+    }
+    const value = obj[name];
+    const res1 = isBasicsType(value);
+    if (res1.isBasics) {
+      // @ts-ignore
+      newObj[name] = res1.value;
+      continue;
+    }
+    const res2 = isArrayType(value);
+    if (res2.isArray) {
+      // @ts-ignore
+      newObj[name] = res2.value.map((t: any) => deepClone(t, depth + 1));
+      continue;
+    }
+    // @ts-ignore
+    newObj[name] = deepClone(value, depth + 1);
+  }
+  return newObj;
+}
+
+/**
+ * 序列化data
+ * @param data
+ */
+function serializeData(data: any): string {
+  const obj = deepClone(data, 0);
+  return JSON.stringify(obj);
+}
+
+export default {
+  reportData,
+  emptyFunc,
+  executeFunc,
+  serializeData,
+};

package/src/report/proxy/index.ts

@@ -0,0 +1,20 @@
+/**
+ * 负责页面和组件的全埋点
+ */
+
+import proxyPage from './page';
+import proxyComponent from './component';
+
+let isInit = false;
+
+function init(): void {
+  if (!isInit) {
+    isInit = true;
+    proxyPage.init();
+    proxyComponent.init();
+  }
+}
+
+export default {
+  init,
+};

package/src/report/proxy/page.ts

@@ -0,0 +1,80 @@
+/**
+ * 负责页面的全埋点
+ */
+
+import helper from './helper';
+
+// 必须上报的生命周期函数
+const mustLifeMethods = ['onLoad', 'onShow', 'onReady', 'onHide', 'onUnload'];
+// 可能会有的生命周期函数
+const maybeLifeMethods = [
+  'onPullDownRefresh', 'onReachBottom', 'onShareAppMessage',
+  'onShareTimeline', 'onAddToFavorites', 'onPageScroll',
+];
+const lifeMethods = mustLifeMethods.concat(maybeLifeMethods);
+
+let originalPage: any = null;
+
+// 劫持Page的生命周期
+function proxyLifeMethod(pageOptions: any, methodName: string): void {
+  if (!pageOptions[methodName] && !mustLifeMethods.includes(methodName)) {
+    return;
+  }
+  const original = pageOptions[methodName] || helper.emptyFunc;
+  // eslint-disable-next-line no-param-reassign
+  pageOptions[methodName] = function (...args: any[]): any {
+    let elapsed: number | '' = ''; // 页面曝光时间
+    let showCount: number | '' = ''; // 曝光次数
+    if (methodName === 'onShow') {
+      this.tmsPageShowCount = (this.tmsPageShowCount || 0) + 1;
+      this.tmsPageShowTime = Date.now();
+      showCount = this.tmsPageShowCount;
+    } else if (methodName === 'onHide' || methodName === 'onUnload') {
+      elapsed = Date.now() - this.tmsPageShowTime;
+      this.tmsPageShowTime = 0;
+      showCount = this.tmsPageShowCount;
+    }
+    // 执行原函数之后再发埋点
+    return helper.executeFunc(this, original, args, () => {
+      const data = helper.serializeData(this.data);
+      helper.reportData(`Page_${methodName}`, data, showCount, elapsed);
+    });
+  };
+}
+
+// 劫持其他事件
+function proxyHandle(pageOptions: any, methodName: string): void {
+  const original = pageOptions[methodName] || helper.emptyFunc;
+  // eslint-disable-next-line no-param-reassign
+  pageOptions[methodName] = function (...args: any[]): any {
+    // 执行原函数之后再发埋点
+    return helper.executeFunc(this, original, args, () => {
+      const data = helper.serializeData(this.data);
+      helper.reportData(`Page_${methodName}`, data);
+    });
+  };
+}
+
+// 劫持Page
+function init(): void {
+  // @ts-ignore
+  originalPage = Page;
+  // @ts-ignore
+  Page = function (options: any) {
+    // 只有tms的页面才需要上报
+    if (options.tmsAutoReport) {
+      for (const methodName of lifeMethods) {
+        proxyLifeMethod(options, methodName);
+      }
+      // tmsReportEvents是由工具在编译时分析出的要上报的事件列表
+      for (const methodName of options.tmsReportEvents) {
+        proxyHandle(options, methodName);
+      }
+    }
+    originalPage(options);
+  };
+}
+
+export default {
+  init,
+};