mpvue插件版小程序框架接入指南

准备工作

注册并登录阿拉丁统计平台,并在统计平台创建自己的小程序。
接入流程:登录统计平台 - 创建微信小程序 - 提交小程序信息 - 开始接入

一、设置域名

登录微信公众平台(mp.weixin.qq.com),在 开发→开发者设置->服务器域名 找到「 request 合法域名」,点击「修改」,将 log.aldwx.com 添加 request 合法域名中。
复制下方域名并添加
1
log.aldwx.com
Copied!

二、 配置SDK

1、点击下载微信小程序SDK,并将下载的文件解压,将解压后的文件夹移动到小程序根目录中 static 文件夹下。
2、使用微信开发者工具打开 ald-stat-conf.js 文件(文件路径:static/sdk/ald-stat-conf.js ),登录阿拉丁小程序平台-管理-小程序列表-找到需要集成的小程序,复制对应小程序的 AppKey 到 exports.app_key = ""; 的双引号中间;其次,需要将 exports.plugin 设置为 true
引号前后不能有空格;其他配置项请勿随意更改。
3、在小程序项目的根目录下打开 src 文件夹下的 main.js 文件,通过 import { MpvueApp } from '../static/sdk/ald-stat' 引入SDK;其次,在实例化 Vue 的时候调用MpvueApp 并以参数的形式传入。
复制下方代码并添加
1
import { MpvueApp } from '../static/sdk/ald-stat' //第一行添加此行代码
2
import Vue from 'vue'
3
import App from './App'
4
5
Vue.config.productionTip = false
6
App.mpType = 'app'
7
8
//实例化Vue的时候调用MpvueApp并以参数的形式传入
9
const app = new Vue( MpvueApp(App) )
10
app.$mount()
Copied!
4、打开小程序根目录下 src 文件夹中 pages 文件下所有 main.js 结尾的文件,通过 import { MpvueApp } from '../static/sdk/ald-stat' 引入SDK,其次,在实例化Vue的时候调用 MpvuePage 并以参数的形式传入。
pages 文件下所有 main.js 结尾的文件都需要引入。
复制下方域名并添加
1
import { MpvuePage } from '../static/sdk/ald-stat' //第一行添加此行代码
2
import Vue from 'vue'
3
import App from './App'
4
5
//实例化Vue的时候调用MpvuePage并以参数的形式传入
6
const app = new Vue( MpvuePage(App) )
7
app.$mount()
Copied!

三、检测上报状态

在微信开发者工具中,查看控制台中的 Network 是否存在 d.html 开头的请求,点击后可看到 log.aldwx.com 的域名信息,且 status 状态为 200
验证成功后,将所有代码提交至微信审核,审核通过后需发布版本
以上流程全部配置完成后了,表示小程序已经成功接入了阿拉丁统计平台。
如果遇到问题可以咨询您的同事(前端技术人员)或者咨询阿拉丁统计平台客服(微信ID:alddandan)。

高级功能

为了提高数据准确性,我们建议您上报 OpenID ,采用 OpenID 的方式进行计算。
自定义事件是阿拉丁统计平台为开发者提供的自助分析功能。用户在小程序上的行为,我们定义为事件,可以帮助您更好的分析用户的关键行为,做到针对性运营。
最近更新 1yr ago