前言
现在更新h5到浙政钉居然要审核(上传源码用IRS平台打包,很容易不兼容 ),巨麻烦,特此写文章总结。
bid、sapp_id等我都用*****代替,具体信息谁让你干这活儿的找谁要。
用的mixin(router当然更优,毕竟打包小一些)
代码(vue2)
1、检测工具
vconsole可以查看xxxxx/upload,这是稳定性埋点
eruda开启 Snippets - Load Timing Plugin,可以查看xxxxx.gif,这是流量性埋点
这俩工具只能各检测一种(很有专业性)
切记,做完的时候记得各存一份埋点的各种数据,不然政府办事员他们,可能要向你要数据手动确认(挺负责的,还指出哪里不符合要求)
index.html
<!-- <script src="//cdn.jsdelivr.net/npm/eruda"></script>
<script>
eruda.init();
</script> -->
main.js
// import Vconsole from "vconsole";
// const vConsole = new Vconsole();
// Vue.use(vConsole);
2、index.html
在header中放入以下代码,需要改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
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>
<script>
(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",
//专有云应用,第二个参数在部署时请替换为正确的专有云地址dalog-api.ding.zj.gov.cn
arguments: ["aplus-rhost-v", "alog-api.ding.zj.gov.cn"],
});
aplus_queue.push({
action: "aplus.setMetaInfo",
//专有云应用,第二个参数在部署时请替换为正确的专有云地址alog-api.ding.zj.gov.cn
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"],
});
</script>
3、utils/zzdmd.js
/* eslint-disable */
export function setMd(page_id, page_name, page_url, _user_id) {
aplus_queue.push({
action: "aplus.setMetaInfo",
arguments: ["_hold", "BLOCK"],
});
// 用户信息埋点----------------------------------------
// 单页应用 或 “单个页面”需异步补充PV日志参数还需进行如下埋点 ------
/* eslint-disable-next-line */
aplus_queue.push({
action: "aplus.setMetaInfo",
arguments: ["aplus-waiting", "MAN"],
});
/* eslint-disable-next-line */
aplus_queue.push({
action: "aplus.sendPV",
arguments: [
{
is_auto: false,
},
{
// 当前你的应用信息,此两行按应用实际参数修改,不可自定义。
sapp_id: "*******",
sapp_name: "*******",
page_id: page_id, // 可以用this.$route.meta.pagePath代替
page_name: page_name, // 可以用this.$route.meta.name代替
page_url: page_url, // 可以用this.$route.meta.pagePath代替
},
],
});
// 设置会员昵称(没要求,先不设置了)
/* eslint-disable-next-line */
// aplus_queue.push({
// action: "aplus.setMetaInfo",
// arguments: ["_user_nick", _user_nick], // 需替换为当前登录的浙政钉用户名字,uni.getStorageSync('userInfo').employeeName
// });
// 设置会员ID
/* eslint-disable-next-line */
aplus_queue.push({
action: "aplus.setMetaInfo",
arguments: ["_user_id", _user_id], // 需替换为当前登录的浙政钉用户id,
});
/* eslint-disable-next-line */
aplus_queue.push({
action: "aplus.setMetaInfo",
arguments: ["_dev_id", "yourDeviceId"],
});
// 如采集用户信息是异步行为,需要先设置完用户信息后再执行这个START埋点
// 此时被block住的日志会携带上用户信息逐条发出
/* eslint-disable-next-line */
aplus_queue.push({
action: "aplus.setMetaInfo",
arguments: ["_hold", "START"],
});
}
4、utils/zzdmdmx.js
accountId一般是登录成功就会给的,记得转为String
/* eslint-disable */
import { setMd } from "./zzdmd.js";
export default {
data() {
return {};
},
mounted() {
const that = this;
that.$nextTick(() => {
that.zzdmdStart();
});
},
methods: {
zzdmdStart() {
// 分别是当前页的英文名(home)、当前页的中文名(主页),当前的完整url,用户的accountId
setMd(this.$route.name, this.$route.meta.title, "https://aaaaaaa.com/#" + this.$route.path, this.$store.state.user.accountId);
},
},
};
5、main.js
import zzdmdmx from "@/utils/zzdmdmx.js";
Vue.mixin(zzdmdmx);
其他
里面的各种字段,一定要String格式,不然不接收
开了vconsole或eruda等调试工具时,点击调试工具按钮,页面会报一个错误。无伤大雅,如果谁能解决那个问题,请留言
看到这里点个赞鼓励下吧,求求