yunlogger_yunzhan v1.0.6

SLS JavaScript Logging SDK

1. 安装

• 通过 npm 安装 SDK npm i yunlogger_yunzhan
• 在 app.ts 中通过 import 引入 SDK

import YunLOGGER from "yunlogger_yunzhan";

2. 添加可信域名

登录微信公众平台，进入<开发><开发设置><服务器域名>，将 host 添加为 request 合法域名。

3. init 初始化

init(options: object)

配置接口，用来调整 SDK 的基础机制。应该在 App()调用之前调用。

首次调用初始化 SDK，再次调用覆盖之前传入的配置，可多次调用。

4. 基础信息更新

change(options:object)

• 页面初始化调用，存储租户 ID 和用户 ID
• 用户登录、退出操作更新信息

5. send 消息

send(options:object)

组件交互触发消息

方法初始化

import YunLOGGER from 'yunlogger_yunzhan';
import loggerConfigs from '@/utils/loggerconsts';

const { ENV_TYPE } = process.env;
const loggerConfig = loggerConfigs[`${ENV_TYPE}-logger`] || loggerConfigs['production-logger'];

const initLogger = (ip) => {
  const { channelID = "" } = urlToObject();
  window.logger = new YunLOGGER({
    ip,
    device: "pc",
    channelID,
    ...loggerConfig,
  });

  // 简化传参的埋点方法
  window.sender = (params) => {
    window.logger.send({
      url: window.location.pathname,
      action: "click",
      target: "",
      componentID: "",
      exhibitionID: "",
      category: "",
      owner: "OTHER",
      ownerId: "",
      content: "",
      behavior: "",
      tenant: sessionStorage.getItem("tenantId"),

      ...(params || {}),
    });
  };
};

logconfig根据环境取值

获取url中参数urlToObject

/**
 * @function 获取url中的参数并转换为对象
 * @returns {object}
 * */
const urlToObject = (url = window.location.href) => {
  // 箭头函数默认传值为当前页面url
  let obj = {},
    index = url.indexOf('?'), // 看url有没有参数
    params = url.substr(index + 1); // 截取url参数部分 id = 1 & type = 2

  if (index != -1) {
    // 有参数时
    let parr = params.split('&'); // 将参数分割成数组 ["id = 1 ", " type = 2"]
    for (let i of parr) {
      // 遍历数组
      let arr = i.split('='); // 1） i id = 1   arr = [id, 1]  2）i type = 2  arr = [type, 2]
      obj[arr[0]] = arr[1]; // obj[arr[0]] = id, obj.id = 1   obj[arr[0]] = type, obj.type = 2
    }
  }

  return obj;
};

获取ip

IP 地址，接口获取 /api/v2/auth/sys/ip

logconfig

/**
 * 开发环境埋点配置
 */
const Dev_Logger = {
  project: 'hz-hj-web-8hd',
  host: 'cn-hangzhou.log.aliyuncs.com',
  logstore: 'hz-hj-qd-8dev',
};

/**
 * 预发环境埋点配置
 */
const Pre_Logger = {
  project: 'hz-hj-web-8hd',
  host: 'cn-hangzhou.log.aliyuncs.com',
  logstore: 'hz-hj-qd-8test',
};

/**
 * 测试环境埋点配置
 */
const Daily_Logger = {
  project: 'hz-hj-web-8hd',
  host: 'cn-hangzhou.log.aliyuncs.com',
  logstore: 'hz-hj-qd-8test',
};

/**
 * 生产环境埋点配置
 */
const Prod_Logger = {
  project: 'hz-hj-web-8hd',
  host: 'cn-hangzhou.log.aliyuncs.com',
  logstore: 'hz-hj-qd-8prod',
};

export default {
  'development-logger': devLogger,
  'pre-logger': preLogger,
  'daily-logger': dailyLogger,
  'production-logger': prodLogger,
};

发送埋点demo

 // 点击的埋点
  const buryItemPoint = (params) => {
    window.sender({
      url: '/project/detail',
      action: 'click',
      category: 'project',
      owner: 'EXHIBITOR',
      ownerId: data?.ownerId,
      exhibitionID: exbId || sessionStorage.getItem('exhibitionId'),
      ...params,
    });
  };

参数详解释

1、埋点字段说明

2、字段详细解释

只统计PV/UV

所需参数

• 需要输出channelID与url的对应表
• channelID命名示例： shanghaidianqi_01（上海电气的第一个页面）