DeepShare JS 集成

优质

小牛编辑

115浏览

2023-12-01

1. 集成SDK

在落地页H5页面的<head>和</head>标签中，嵌入下面代码，即可完成SDK的安装：

<script type = "text/javascript"> 
(function() {
    window.zhuge = window.zhuge || [];
    window.zhuge.methods = "_init identify track getDid getSid getKey setSuperProperty setUserProperties setWxProperties setPlatform".split(" ");
    window.zhuge.factory = function(b) {
        return function() {
            var a = Array.prototype.slice.call(arguments);
            a.unshift(b);
            window.zhuge.push(a);
            return window.zhuge;
        }
    };
    for (var i = 0; i < window.zhuge.methods.length; i++) {
        var key = window.zhuge.methods[i];
        window.zhuge[key] = window.zhuge.factory(key);
    }
    window.zhuge.load = function(b, x) {
        if (!document.getElementById("zhuge-js")) {
            var a = document.createElement("script");
            var verDate = new Date();
            var verStr = verDate.getFullYear().toString() + verDate.getMonth().toString() + verDate.getDate().toString();
            a.type = "text/javascript";
            a.id = "zhuge-js";
            a.async = !0;
            a.src = (location.protocol == 'http:' ? "http://sdk.zhugeio.com/zhuge.min.js?v=": 'https://zgsdk.zhugeio.com/zhuge.min.js?v=') + verStr;
            a.onerror = function() {
                window.zhuge.identify = window.zhuge.track = function(ename, props, callback) {
                    if (callback && Object.prototype.toString.call(callback) === '[object Function]') callback();
                };
            };
            var c = document.getElementsByTagName("script")[0];
            c.parentNode.insertBefore(a, c);
            window.zhuge._init(b, x)
        }
    };
    window.zhuge.load('此处填写您在诸葛申请的APP KEY', {
        platform: { //自定义触发环境信息(选填)
            '版本': 'v1.0'
        },
        superProperty: { //全局的事件属性(选填)               
            '应用名称': '诸葛io'
        },
        autoTrack: false,
        //启用全埋点采集（选填，默认false）            
        singlePage: false //是否是单页面应用（SPA），启用autoTrack后生效（选填，默认false）   
    });
})(); 
</script>

2. 启用DeepShare

启用DeepShare，您需要打开DeepShare开关，开关默认是关闭状态，需要您在页面接入SDK的代码window.zhuge.load()中，通过设置DeepShare参数，手动开启开关，同时绑定参数。

var deepshare = null
window.zhuge.load('此处填写您在诸葛申请的APP KEY', {
    deepShare: true,// 启用deepshare，默认关闭
    onLoadDeepShare: function () {//deepshare加载成功的回调
    var data = {
    name : "商品ID",
}
//组装参数
        var params = {
            inapp_data : data,
            channels:["channelName"],
            download_title : "我是download_title",
            download_msg : "我是download_msg"
        }
      deepshare = new DeepShare('此处填写您在您在诸葛申请的APP KEY')
        deepshare.BindParams(params);
    }
  });

DeepShare实例需要在onLoadDeepshare回调函数中进行初始化，以避免DeepShares的sdk加载成功之前初始化失败。

3. BindParams函数参数详解

3.1. 场景还原

inapp_data：通过将应用内的场景还原参数（例如文章地址、商品ID等）设置到inapp_data域，当App启动时通过调用DeepShare的init方法，就可以得到此场景还原参数。

示例如下：

var data = {
    name : "商品ID",
}
var params = {
    inapp_data : data,
}

其中data中参数格式可以为任意Json数据格式，例如：

字符串：name : “商品ID”,
整数：value : 1,
布尔值：is_ok : true,
…

3.2. 渠道监测

channels：通过设置channels域，自动将安装前后的渠道绑定起来，之后可以通过诸葛平台查看渠道的表现。

3.3. 下载页面自定义提示信息

download_title：可以附加显示在跳转商店页面的信息，可以给用户更好的引导。
download_msg：可以附加显示在跳转商店页面的信息，可以给用户更好的引导。

下载页面只会在iOS9 Universal Link的Web中转页面和Android直接下载APK的中转页面出现。

示例图为添加download_title和download_msg后的效果。

4. 触发跳转

在落地页H5页面的点击动作里面通过调用deepshare.Start()触发跳转。

document.getElementById('#GoToAppButton').addEventListener('click', function() {
    // 触发跳转
    deepshare.Start();
})