visual-buried-point-platform-h5 1.3.4

package/lsi-md5.js

@@ -0,0 +1,22 @@
+const fs = require("fs");
+const MD5 = require("md5");
+
+const packageJson = require("./package.json");
+const { name, version } = packageJson;
+// MD5
+const combinedString = name + version;
+const md5Str = MD5(combinedString);
+packageJson.lsi = md5Str;
+//base64
+// const combinedString = name.substring(0, 16) + "v" + version;
+// const base64Str = btoa(combinedString);
+// packageJson.lsi = base64Str;
+
+const updatedPackageJson = JSON.stringify(packageJson, null, 2);
+fs.writeFileSync("./package.json", updatedPackageJson, "utf8");
+
+console.log('write package.json "lsi" value success ');
+
+module.exports = {
+  md5Str,
+};

package/package.json

@@ -0,0 +1,37 @@
+{
+  "name": "visual-buried-point-platform-h5",
+  "version": "1.3.4",
+  "lsi": "9c772ffbee84e8f3e1a5df28ef6a3fa3",
+  "description": "可视化埋点WebSdk",
+  "main": "dist/buried-point-h5.js",
+  "scripts": {
+    "dev": "rollup -c -w",
+    "build": "rollup -c --environment INCLUDE_DEPS,BUILD:production && node lsi-md5.js"
+  },
+  "repository": {
+    "type": "git",
+    "url": ""
+  },
+  "author": "",
+  "license": "MIT",
+  "dependencies": {
+    "html2canvas": "^1.4.1",
+    "js-base64": "^3.7.3",
+    "md5": "^2.3.0",
+    "pako": "1.0.11",
+    "tslib": "^1.9.3",
+    "typescript": "^3.5.3"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.5.5",
+    "babel-preset-es2015": "^6.24.1",
+    "rollup": "^1.20.2",
+    "rollup-plugin-babel": "^4.3.3",
+    "rollup-plugin-commonjs": "^10.0.2",
+    "rollup-plugin-node-resolve": "^5.2.0",
+    "rollup-plugin-replace": "^2.2.0",
+    "rollup-plugin-typescript": "^1.0.1",
+    "rollup-plugin-uglify": "^6.0.2",
+    "webpack": "^4.39.2"
+  }
+}

package/rollup.config.js

@@ -0,0 +1,36 @@
+import babel from "rollup-plugin-babel";
+import commonjs from "rollup-plugin-commonjs";
+import resolve from "rollup-plugin-node-resolve";
+import replace from "rollup-plugin-replace";
+import typescript from "rollup-plugin-typescript";
+import { uglify } from "rollup-plugin-uglify";
+let pkg = require("./package.json");
+
+
+export default {
+  input: "src/index.ts",
+  output: {
+    file: "dist/buried-point-h5.js",
+    format: "umd",
+    name: "BuriedPointH5",
+    sourcemap: false, // 是否打包sourcemap
+  },
+  plugins: [
+    replace({
+      VERSION: pkg.version,
+      LSI: pkg.lsi,
+      delimiters: ["{{", "}}"],
+    }),
+    typescript(),
+    commonjs({ extensions: [".js", ".ts"] }),
+    resolve({
+      jsnext: true,
+      main: true,
+      browser: true,
+    }),
+    babel({
+      exclude: "node_modules/**",
+    }),
+    process.env.BUILD === "production" ? uglify() : null,
+  ],
+};

package/src/config/global.ts

@@ -0,0 +1,82 @@
+import { randomString } from "../utils/tools";
+
+// 默认参数
+export let GlobalVal = {
+  page: "", // 当前页面
+  sid: "", // session id,页面切换就会改变
+  sBegin: Date.now(), // 修改sid时间
+  _health: {
+    errcount: 0,
+    apisucc: 0,
+    apifail: 0,
+  },
+  // 在iframe方式下 是否开启埋点
+  circle: false,
+  // 在iframe方式下 是否开启回显
+  cssInserted: false,
+  /** 在打通与APP之间的通信时  是否开启埋点操作  默认关闭 */
+  enableJavaScriptBridgeCircle: false,
+  /** 用户Id */
+  userId: "",
+  /** 匿名Id */
+  anonId: "",
+  /** 全局访问来源途径 */
+  accessPath: "",
+  /** 进入网站的渠道页面来源 */
+  referrer: "",
+  /** 入口页面的Url */
+  enterUrl: "",
+  /** 离开页面的Url */
+  leaveUrl: "",
+  /** 链路id */
+  trackId: "",
+  /** 操作系统 */
+  os: "",
+  /** 新数据结构操作系统 */
+  osNew: "",
+  /** 系统版本 */
+  osVersion: "",
+  /** 新数据结构设备类型 */
+  deviceType: 2,
+  /** 浏览器名字 */
+  browserName: "",
+  /** 浏览器版本 */
+  browserVersion: "",
+  /** lsi */
+  lsi: "",
+  /** packageName */
+  packageName: "",
+  /** 型号 */
+  brand: "",
+  /** app信息 */
+  app: null,
+  /** 设备信息 */
+  device: null,
+  /** 访问页面路由记录数组 */
+  routerArray: [],
+  /** 应用载体 */
+  ecology: "",
+};
+
+export function setGlobalPage(page) {
+  GlobalVal.page = page;
+}
+
+export function setGlobalSid() {
+  GlobalVal.sid = randomString();
+  GlobalVal.sBegin = Date.now();
+}
+
+export function setGlobalHealth(type: string, success?: boolean) {
+  if (type === "error") GlobalVal._health.errcount++;
+  if (type === "api" && success) GlobalVal._health.apisucc++;
+  if (type === "api" && !success) GlobalVal._health.apifail++;
+}
+
+export function resetGlobalHealth() {
+  GlobalVal._health = {
+    errcount: 0,
+    apisucc: 0,
+    apifail: 0,
+  };
+}

package/src/config/index.ts

@@ -0,0 +1,138 @@
+import { IInitConfig } from "../typings";
+
+// 默认参数
+export let Config: IInitConfig = {
+  // 上报地址
+  reportUrl: "",
+  /** 新的数据结构自定义上报 */
+  reportEventUrl: "",
+  /** 获取已埋点事件列表 */
+  eventListPath: "",
+  /** puv上报地址 */
+  reportPUVUrl: "",
+  /** 获取元数据配置表*/
+  metaConfigPath: "",
+  // 提交参数
+  token: "",
+  /** 业务板块  */
+  busSegment: "",
+  /** 业务模块 */
+  module: "",
+  // app版本
+  appVersion: "1.0.0",
+  // 环境 默认开发环境 `dev`
+  environment: "dev",
+  // 脚本延迟上报时间
+  outtime: 300,
+  // 开启单页面？
+  enableSPA: true,
+  // 是否自动上报pv
+  autoSendPv: true,
+  // 是否上报页面性能数据
+  isPage: false,
+  // 是否上报ajax性能数据
+  isAjax: false,
+  // 是否上报页面资源数据
+  isResource: false,
+  // 是否上报错误信息
+  isError: false,
+  // 是否录屏
+  isRecord: false,
+  // 是否上报行为
+  isBehavior: true,
+  // 是否开启页面浏览时长采集
+  enableTrackPageLeave: true,
+  /** 是否开启了CSS HASH值 默认开启*/
+  isOpenCSSHash: true,
+  ignore: {
+    ignoreErrors: [],
+    ignoreUrls: [],
+    ignoreApis: [],
+  },
+  behavior: {
+    console: [], // 取值可以是"debug", "info", "warn", "log", "error"
+    click: true,
+  },
+  // 最长上报数据长度
+  maxLength: 1000,
+  // Web JS SDK 的 H5 页面，在嵌入到 App 后，H5 内的事件可以通过 App 进行发送 默认关闭
+  enableJavaScriptBridge: false,
+  // 打通H5与APP通信后，上报数据ID
+  androidToken: null,
+  iosToken: null,
+};
+
+// 根据环境 设置上报地址
+function setReportPath(environment: string): {
+  reportUrl: string;
+  reportEventUrl: string;
+  reportTrackUrl: string;
+  eventListPath: string;
+  reportPUVUrl: string;
+  metaConfigPath: string;
+} {
+  switch (environment) {
+    case "test":
+      return {
+        reportUrl:
+          "https://buryingpoint.gcongo.com.cn/api/report/data/reportDataFromWeb",
+        reportEventUrl: "https://buryingpoint.gcongo.com.cn/client/api/event",
+        reportTrackUrl: "https://buryingpoint.gcongo.com.cn/client/api/track",
+        eventListPath: "https://buryingpoint.gcongo.com.cn/api/event/query/",
+        reportPUVUrl:
+          "https://buryingpoint.gcongo.com.cn/api/report/data/reportData/browse",
+        metaConfigPath:
+          "https://buryingpoint.gcongo.com.cn/api/metadataConfig/queryByProject/",
+      };
+    case "press":
+      return {
+        reportUrl:
+          "https://buryingpoint.gcongo.com.cn/api/report/data/reportDataFromWeb",
+        reportEventUrl: "",
+        reportTrackUrl: "",
+        eventListPath: "https://buryingpoint.gcongo.com.cn/api/event/query/",
+        reportPUVUrl:
+          "https://buryingpoint.gcongo.com.cn/api/report/data/reportData/browse",
+        metaConfigPath:
+          "https://buryingpoint.gcongo.com.cn/api/metadataConfig/queryByProject/",
+      };
+    case "prod":
+      return {
+        reportUrl:
+          "https://buryingpoint.onebuygz.com/api/report/data/reportDataFromWeb",
+        reportEventUrl: "https://buryingpoint.onebuygz.com/client/api/event",
+        reportTrackUrl: "https://buryingpoint.onebuygz.com/client/api/track",
+        eventListPath: "https://buryingpoint.onebuygz.com/api/event/query/",
+        reportPUVUrl:
+          "https://buryingpoint.onebuygz.com/api/report/data/reportData/browse",
+        metaConfigPath:
+          "https://buryingpoint.onebuygz.com/api/metadataConfig/queryByProject/",
+      };
+    default:
+      return {
+        reportUrl:
+          "https://buryingpoint.onebuygz.com/api/report/data/reportDataFromWeb",
+        reportEventUrl: "https://buryingpoint.onebuygz.com/client/api/event",
+        reportTrackUrl: "https://buryingpoint.onebuygz.com/client/api/track",
+        eventListPath: "https://buryingpoint.onebuygz.com/api/event/query/",
+        reportPUVUrl:
+          "https://buryingpoint.onebuygz.com/api/report/data/reportData/browse",
+        metaConfigPath:
+          "https://buryingpoint.onebuygz.com/api/metadataConfig/queryByProject/",
+      };
+  }
+}
+
+// 设置参数
+export function setConfig(options: IInitConfig) {
+  const pathData = setReportPath(options.environment);
+  Config = {
+    ...Config,
+    ...options,
+    ...pathData,
+  };
+}
+
+export function getConfig(e: string): string {
+  return e ? (Config[e] ? Config[e] : {}) : {};
+}

package/src/hack.ts

@@ -0,0 +1,201 @@
+import {
+  parseUrl,
+  fnToString,
+  warn,
+  dispatchCustomEvent,
+  parseHash,
+  getLocationHref,
+} from "./utils/tools";
+import { handleBehavior, handleApi, setPage } from "./handlers";
+import { Config } from "./config";
+/**
+ * @监听console
+ * hack console
+ * "debug", "info", "warn", "log", "error"
+*/
+export function hackConsole() {
+  if (window && window.console) {
+    for (var e = Config.behavior.console, n = 0; e.length; n++) {
+      var r = e[n];
+      var action = window.console[r];
+      if (!window.console[r]) return;
+      (function (r, action) {
+        window.console[r] = function () {
+          var i = Array.prototype.slice.apply(arguments);
+          var s: consoleBehavior = {
+            type: "console",
+            data: {
+              level: r,
+              message: JSON.stringify(i),
+            },
+          };
+          handleBehavior(s);
+          action && action.apply(null, i);
+        };
+      })(r, action);
+    }
+  }
+}
+
+/**
+ * hack pushstate replaceState
+ * 派送historystatechange historystatechange事件
+ * @export
+ * @param {('pushState' | 'replaceState')} e
+ */
+export function hackState(e: "pushState" | "replaceState") {
+  let t = history[e];
+  "function" == typeof t &&
+    ((history[e] = function (n, i, s) {
+      !window["__bb_onpopstate_"] && hackOnpopstate(); // 调用pushState或replaceState时hack Onpopstate
+      let len = arguments.length ?? 0;
+      let c = 1 === len ? [arguments[0]] : Array.apply(null, arguments),
+        u = getLocationHref(),
+        f = t.apply(history, c);
+      if (!s || "string" != typeof s) return f;
+      if (s === u) return f;
+      try {
+        let l = u.split("#"),
+          h = s.split("#"),
+          p = parseUrl(l[0]),
+          d = parseUrl(h[0]),
+          g = l[1] && l[1].replace(/^\/?(.*)/, "$1"),
+          v = h[1] && h[1].replace(/^\/?(.*)/, "$1");
+        p !== d
+          ? dispatchCustomEvent("historystatechanged", d)
+          : g !== v && dispatchCustomEvent("historystatechanged", v);
+      } catch (m) {
+        warn("[retcode] error in " + e + ": " + m);
+      }
+      return f;
+    }),
+    (history[e].toString = fnToString(e)));
+}
+
+export function hackhook() {
+  hackFetch();
+  hackAjax();
+}
+
+function hackFetch() {
+  if ("function" == typeof window.fetch) {
+    var __oFetch_ = window.fetch;
+    window["__oFetch_"] = __oFetch_;
+    window.fetch = function (t, o) {
+      var a =
+        1 === arguments.length ? [arguments[0]] : Array.apply(null, arguments);
+      var timestamp = Date.now(),
+        url = (t && "string" != typeof t ? (t as any).url : t) || "",
+        page = parseUrl(url as string);
+      if (!page) return __oFetch_.apply(window, a);
+      return __oFetch_.apply(window, a).then(function (e) {
+        var response = e.clone(),
+          headers = response.headers;
+        if (headers && "function" === typeof headers.get) {
+          var network = headers.get("content-type");
+          if (network && !/(text)|(json)/.test(network)) return e;
+        }
+        var time = Date.now() - timestamp;
+        response.text().then(function (res) {
+          if (response.ok) {
+            handleApi(
+              page,
+              !0,
+              time,
+              status,
+              res.substr(0, 1000) || "",
+              timestamp
+            );
+          } else {
+            handleApi(
+              page,
+              !1,
+              time,
+              status,
+              res.substr(0, 1000) || "",
+              timestamp
+            );
+          }
+        });
+        return e;
+      });
+    };
+  }
+}
+
+// 如果返回过长，会被截断，最长1000个字符
+function hackAjax() {
+  if ("function" == typeof window.XMLHttpRequest) {
+    var timestamp = 0,
+      url = "",
+      page = "";
+    var __oXMLHttpRequest_ = window.XMLHttpRequest;
+    window["__oXMLHttpRequest_"] = __oXMLHttpRequest_;
+    window.XMLHttpRequest = function (t) {
+      var xhr = new __oXMLHttpRequest_(t);
+      if (!xhr.addEventListener) return xhr;
+      var open = xhr.open,
+        send = xhr.send;
+      xhr.open = function (method: string, url?: string) {
+        var a =
+          1 === arguments.length
+            ? [arguments[0]]
+            : Array.apply(null, arguments);
+        url = url;
+        page = parseUrl(url);
+
+        open.apply(xhr, a);
+      };
+      xhr.send = function () {
+        timestamp = Date.now();
+        var a =
+          1 === arguments.length
+            ? [arguments[0]]
+            : Array.apply(null, arguments);
+        send.apply(xhr, a);
+      };
+      xhr.onreadystatechange = function () {
+        if (page && 4 === xhr.readyState) {
+          var time = Date.now() - timestamp;
+          if (xhr.status >= 200 && xhr.status <= 299) {
+            var status = xhr.status || 200;
+            if ("function" == typeof xhr.getResponseHeader) {
+              var r = xhr.getResponseHeader("Content-Type");
+              if (r && !/(text)|(json)/.test(r)) return;
+            }
+            handleApi(
+              page,
+              !0,
+              time,
+              status,
+              xhr.responseText.substr(0, Config.maxLength) || "",
+              timestamp
+            );
+          } else {
+            handleApi(
+              page,
+              !1,
+              time,
+              status || "FAILED",
+              xhr.responseText.substr(0, Config.maxLength) || "",
+              timestamp
+            );
+          }
+        }
+      };
+      return xhr;
+    };
+  }
+}
+
+export function hackOnpopstate() {
+  window["__bb_onpopstate_"] = window.onpopstate;
+  window.onpopstate = function () {
+    let len = arguments.length ?? 0;
+    for (let r = len, a = new Array(r), o = 0; o < r; o++) a[o] = arguments[o];
+    let page = Config.enableSPA
+      ? parseHash(location.hash.toLowerCase())
+      : location.pathname.toLowerCase();
+    setPage(page, false);
+  };
+}