甲方需要提供 sapp_id、sapp_name
后端需要提供一个通过authCode获取用户信息的接口
稳定性监控对接
在 index.html 文件中粘贴以下代码
该页面仅需更改 bid
<script src="https://wpkgate-emas.ding.zj.gov.cn/static/wpk-jssdk.1.0.2/wpkReporter.js" crossorigin="true"></script>
<script>
// 稳定性监控
try {
const config = {
bid: '', // bid 为 sapp_name + "_zzdpro" 需要根据真实sapp_name 修改
signkey: '1234567890abcdef',
gateway: 'https://wpkgate-emas.ding.zj.gov.cn',
};
const wpk = new wpkReporter(config);
wpk.installAll();
window._wpk = wpk;
} catch (err) {
console.error('WpkReporter init fail', err);
}
</script>
H5流量分析对接
一、更改 zzdmd.js 的配置项（文件在上面，下面也有源码）
二、在 main.js 中导入并定义成全局组件
import { funcBurialPoint as BurialPoint } from '@/common/zzdmd';
Vue.prototype.$BurialPoint = BurialPoint;
三、在对应页面中调用埋点方法
onShow() {
this.$BurialPoint('页面名称', this.$route.path);
},
CV大法(复制粘贴改几个参数即可用)
zzdmd.js
/**
* 使用须知
* 更新日期： 2024年3月29日
* 1.需要修改的值：
* sapp_id、sapp_name
* 2.根据自己实际项目 修改 pageInfoList 列表的数据
* id随便填 name和path需要对应
* 3.getLoginInfo 方法中的 获取用户信息接口
*/
// 001-010 一级页面
// 011-100 二级菜单页面
// 101-200 其他菜单页面
// 201-??? 功能页面
/**
* 埋点的需要传的path在调用 funcBurialPoint 方法时传入
* 如: this.$BurialPoint('登录页', this.$route.path);
* @param {string} id 页面ID 自定义的页面ID 埋点里需要记录
* @param {string} name 用于匹配页面
* @param {string} path 该属性仅用于方便本地查找文件 可以不要
*/
const pageInfoList = [
// 一级页面
{ id: '001', name: '登录页', path: '/' },
{ id: '002', name: '首页', path: '/pages/demo' },
// 二级菜单
{ id: '011', name: ' 二级菜单', path: '/pages/demo' },
{ id: '012', name: ' 二级菜单' },
{ id: '013', name: ' 二级菜单' },
// 其他菜单
{ id: '101', name: '其他菜单', path: '/pages/demo' },
{ id: '102', name: '其他菜单' },
{ id: '103', name: '其他菜单' },
// 功能页面
{ id: '201', name: '功能页面', path: '/pages/demo' },
{ id: '201', name: '功能页面' },
{ id: '201', name: '功能页面' },
];
/**
* 判断是否钉钉环境 如果是钉钉环境则返回authCode
* 获取 authCode
* @returns
*/
import dd from 'gdt-jsapi'; // 需要安装一下 npm i gdt-jsapi
function isDingtalkEnv() {
return new Promise((resolve, reject) => {
let ua = navigator.userAgent.toLowerCase();
console.log('环境：', ua);
if (ua.match(/TaurusApp/i)?.length) {
// taurusapp专有钉钉环境
dd.ready(() => {
dd.getAuthCode({
corpId: '', // 新版获取免登授权码 corpId 可不传
})
.then(res => {
// res.code 权限借鉴code
console.log('Success:获取浙政钉免登授权码|', res);
let authCode = res.code || res.auth_code || res.authCode;
resolve(authCode);
})
.catch(err => {
console.error(`Error:获取浙政钉免登授权码|`, err);
reject(err);
});
});
} else {
reject('非专有钉钉');
}
});
}
/**
* !需要后端出接口
* 获取用户信息(用户昵称、用户ID)
* 用户昵称：一般是用户的名字
* @returns
*/
function getLoginInfo(authCode) {
return new Promise((resolve, reject) => {
uni.request({
url: url, // 需要后端出接口 通过 authCode 获取用户信息
data: { authCode },
success: res => {
console.log('getLoginInfo|', res);
resolve(res.data);
},
fail: err => {
reject(err);
},
});
});
}
/**
* 获取用户信息
* @returns
*/
function getUserInfo() {
return new Promise((resolve, reject) => {
isDingtalkEnv()
.then(authCode => {
console.log(`Success:isDingtalkEnv-authCode|`, authCode);
getLoginInfo(authCode)
.then(loginInfo => {
resolve(loginInfo);
})
.catch(err => {
console.error(`Error:getLoginInfo|`, err);
reject(err);
});
})
.catch(err => {
console.error(`Error:isDingtalkEnv-authCode|`, err);
reject(err);
});
});
}
let userInfo = null;
// 获取用户信息的流程方法
function funcGetUserInfo() {
getUserInfo()
.then(res => {
// 这里返回的是用户信息
console.log(`Success:getUserInfo|`, res);
userInfo = res;
})
.catch(err => {
// 接口异常需要清除数据
console.error(`Error:getUserInfo|`, err);
userInfo = null;
});
}
funcGetUserInfo(); // 用户信息一般情况下不会更改 全局默认只调用一次
/**
* 埋点方法
* @param {string} page_name 页面名称 需要和 pageInfoList 中的 name 对应
* @param {string} page_url 页面路由
*/
export async function funcBurialPoint(page_name, page_url) {
console.log('页面调用埋点方法');
if (userInfo !== null) {
const res = userInfo;
const pageInfo = pageInfoList.filter(item => item.name === page_name);
if (!pageInfo || !pageInfo.length) {
console.warning(`Warn:页面${page_name}未添加埋点列表`);
return;
}
const page_id = pageInfo[0].id;
// 通用采集 SDK
(function (w, d, s, q, i) {
w[q] = w[q] || [];
var f = d.getElementsByTagName(s)[0],
j = d.createElement(s);
j.async = true;
j.id = 'beacon-aplus';
j.src = 'https://alidt.alicdn.com/alilog/mlog/aplus_cloud.js';
f.parentNode.insertBefore(j, f);
})(window, document, 'script', 'aplus_queue');
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['aplus-rhost-v', 'alog-api.ding.zj.gov.cn'],
});
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['aplus-rhost-g', 'alog-api.ding.zj.gov.cn'],
});
var u = navigator.userAgent;
var isAndroid = u.indexOf('Android') > -1;
var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: [
'appId',
isAndroid ? '28302650' : isIOS ? '28328447' : '47130293',
],
});
// 用户信息埋点
// 如采集用户信息是异步行为需要先执行这个BLOCK埋点
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['_hold', 'BLOCK'],
});
// 基础埋点
// 单页应用 或 “单个页面”需异步补充PV日志参数还需进行如下埋点：
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['aplus-waiting', 'MAN'],
});
// 单页应用路由切换后 或 在异步获取到pv日志所需的参数后再执行sendPV：
aplus_queue.push({
action: 'aplus.sendPV',
arguments: [
{
is_auto: false,
},
{
// 当前你的应用信息，此两行请勿修改(仅在更换应用时修改)
sapp_id: '',
sapp_name: '',
// 自定义PV参数key-value键值对（只能是这种平铺的json，不能做多层嵌套），如：
page_id, // 页面ID，与page 参数配合使用，保证唯一性必须要入参
page_name, // 页面中文名称必须要入参
page_url, // 页面完整URL，必须要入参
},
],
});
// 设置会员昵称
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['_user_nick', res.ZDRealName], // 当前会员用户昵称
});
// 设置会员ID
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['_user_id', res.ZDingId], // 当前会员ID
});
// 这个目前没有要求，可不设置
// aplus_queue.push({
// action: 'aplus.setMetaInfo',
// arguments: ['_dev_id', '设备ID是业务定义的，用于定义唯一的设备标识。'],
// });
// 如采集用户信息是异步行为，需要先设置完用户信息后再执行这个START埋点
// 此时被block住的日志会携带上用户信息逐条发出
aplus_queue.push({
action: 'aplus.setMetaInfo',
arguments: ['_hold', 'START'],
});
} else {
// 没有用户信息 重新调取一下用户信息方法
console.log('重新获取用户信息');
await funcGetUserInfo();
this.funcBurialPoint();
}
}
注意事项
应用埋点后注意事项
一、远程主机地址
旧版远程主机地址为 alog.zjzwfw.gov.cn
新版文档中建议更新为 alog-api.ding.zj.gov.cn
二、新版免登 corpId 可不用传 【2024年3月28日】
dd.getAuthCode({corpId: ''} // 接触了两个项目的埋点 但是使用的 corpId 是不一致的 对接的官方技术推荐 corpId 不传
扫一扫
3162
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
