秒针小程序监测SDK接入指南
<h3>一、接入说明</h3>
<pre><code class="language-javascript">小程序监测SDK是一款对微信小程序应用专业分析统计工具,开发者注册后快速简洁的集成一段js sdk代码,就能掌控小程序页面访问情况、洞察用户行为。</code></pre>
<h3>二、基础配置</h3>
<h5>2.1 申请接入</h5>
<ul>
<li>发送邮件,根据发送的appId进行授权,邮件申请时需填写小程序的基础信息,以便快速通过审核。</li>
</ul>
<table>
<thead>
<tr>
<th>名称</th>
<th>必填/选填</th>
<th>示例</th>
</tr>
</thead>
<tbody>
<tr>
<td>小程序Id*</td>
<td>必填</td>
<td>wx10348jdsdhsdc4</td>
</tr>
<tr>
<td>所属品牌</td>
<td>选填</td>
<td>可口可乐</td>
</tr>
<tr>
<td>主体信息*</td>
<td>必填</td>
<td>可口可乐(中国)有限公司</td>
</tr>
<tr>
<td>服务类目*</td>
<td>必填</td>
<td>商业服务 > 公关/推广/市场调查</td>
</tr>
<tr>
<td>监测日期*</td>
<td>必填</td>
<td>2019/01/01~2019/05/30</td>
</tr>
</tbody>
</table>
<h5>2.2 配置SDK</h5>
<ul>
<li>
<p>下载 <a href="https://withwinds.cn.miaozhen.com/mz-sdk-v1.0.zip">https://withwinds.cn.miaozhen.com/mz-sdk-v1.0.zip</a> 文件,并解压;</p>
</li>
<li>
<p>将解压后的文件mz-sd.js和mz-sd-default.js拷贝到小程序项目的utils文件夹中;</p>
</li>
<li>
<p>使用编辑器打开app.js文件,在文件顶部(其他代码之前)添加如下代码:</p>
<pre><code class="language-javascript">//app.js
// 秒针小程序监测SDK引入
import './utils/mz-sd';</code></pre>
</li>
<li><font color='red'>如果采用mpvue等框架需要在src目录下的main.js文件的第一行引入上述代码</font></li>
</ul>
<h5>2.3 添加微信合法域名</h5>
<ul>
<li>
<p>管理员或开发者身份在微信小程序后台→设置→开发者设置中添加 request合法域名</p>
<pre><code class="language-javascript">https://withwinds.cn.miaozhen.com</code></pre>
</li>
</ul>
<h5>2.4 接入openId、unionId(在调用SDK的setOuId的方法前,确保其获取的openId、unionId不为空)</h5>
<ul>
<li>
<p>【未授权】用户授权获取openId、unionId后添加如下代码(openId、unionId都需要开发者开发来获取)</p>
<pre><code class="language-javascript">var app = getApp();
var openId,unionId;
openId = "你获取的openId的值";
unionId = "你获取的unionId的值";
// 调用SDK中方法,绑定openId、unionId;
app.mzsd.setOuId(openId, unionId);
// 此时可能还需要开发者将openId, unionId储存到小程序的缓存中,用于在接入SDK前就已经授权的用户启动小程序时直接绑定用户身份;
//以缓存形式存openId、unionId示例(可以单独储存也可以以userInfo对象的形式存储);
// wx.setStorageSync('openId', openId);
// wx.setStorageSync('unionId', unionId);</code></pre>
</li>
<li>
<p>【已授权】接入监测SDK前就已经授权的用户启动小程序时直接调用先前储存的openId、unionId来绑定用户身份,此步骤需要在app.js文件的APP回调的onLaunch方法中(尽量在此方法的第一行)</p>
<pre><code class="language-javascript">// app.js/main.js(mpvue框架下的启动文件)
// 秒针小程序监测SDK引入
import './utils/mz-sd';
App({
onLaunch: function(options) {
this.mzsd.setOuId(
wx.getStorageSync('openId').openId,
wx.getStorageSync('unionId').unionId
},
})</code></pre>
</li>
</ul>
<h5>2.5 mz-sd-default.js文件配置项</h5>
<ul>
<li>
<pre><code class="language-javascript">// mz-sd-default.js
exports.appid = ""; // 必填,小程序appId
exports.getLocation = false; // 默认不获取用户坐标位置,默认为空字符
exports.defSharePath = ""; // 用于分享时path为空的时的默认页面,默认为空字符</code></pre>
</li>
</ul>
<h5>2.6 校验是否接入成功</h5>
<ul>
<li>小程序编译器=>调试器=>Network(类型选择'all'),查看其下的网络发送日志,name中有me.gif、md.gif、mf.gif三个网络请求中的其中一个,并且返回的状态码为200,则表明接入成功</li>
</ul>
<h3>三、高级功能</h3>
<h5>3.1 路径分析(添加页面标题)</h5>
<ul>
<li>
<p>在每一个page中添加mzPageTitle字段</p>
<pre><code class="language-javascript">// pages/home/index.js
Page({
mzPageTitle: "首页",
data: {
},
})</code></pre>
</li>
<li>【mpvue框架中接入】在每一个page中添加mzPageTitle字段
<pre><code class="language-javascript">// pages/index/main.js
getApp().mzPageTitle = '首页'; // 需要在app.$mount();之后</code></pre></li>
</ul>
<h5>3.2 自定义事件</h5>
<ul>
<li>自定义事件需要开发者调用SDK中方法sendEvent;</li>
<li>特殊事件:报错事件(mz_error_message)、下拉刷新(mz_pulldownrefresh)、滚动触底(mz_reachbottom)、分享(mz_share_chain)、访问(mz_visit)、打开(mz_open);</li>
<li>
<p><font color='red'>注意:
1.四个参数数据类型为字符串形式
2.事件编码(ecode需要开发者添加时注意唯一性,否则会导致数据不准确);
3.自定义事件编码ecode不能与以上特殊事件(括号中为ecode)重复;
</font></p>
<pre><code class="language-javascript">var app = getApp();
app.mzsd.sendEvent('事件名', {
ecode: '事件编码',
edes: '事件描述',
eval: '事件附加属性值',
});</code></pre>
<p><font color='red'>
4.自定义标签,用于给用户打推荐标签;
</font></p>
<pre><code class="language-javascript">var app = getApp();
app.mzsd.sendEvent('标签', { //固定
ecode: 'mz_tag', //固定
edes: 'xxxx', //活动标签或描述,需用户定义
eval: 'xxxx|xxxx|xxxx', //标签列表,允许多个,以中竖线分隔[|],需用户定义
});</code></pre>
<p><img src="https://www.showdoc.cc/server/api/common/visitfile/sign/e15e46993bf75082572e040d7c79508e?showdoc=.jpg" alt="" /></p>
</li>
</ul>
<h5>3.3 添加渠道</h5>
<ul>
<li>用于统计小程序的推广渠道</li>
<li>
<p>分享时,添加在path路径中,参数名mz_utm,参数值为渠道编码(id)</p>
<pre><code class="language-javascript">onShareAppMessage: function() {
title: title,
path: 'pages/home/index?mz_utm=' + '12345',
...
}</code></pre>
</li>
</ul>
<h5>3.4 获取用户头像昵称</h5>
<ul>
<li>秒针小程序监测sdk不会主动发起用户授权请求,需要由开发者在小程序中发起用户授权请
求,sdk才可以收集到用户信息。</li>
</ul>