MobTech MobLink Web端快速集成指南

Web快速集成

1、在开发者后台找到MobLink的 页面配置 栏，在 浮层配置 选项卡中，参考下图所示步骤来个性化你的App：

2、浮层配置完成后切换到 引用JS文件 选项卡，直接点击 复制 按钮，如下图所示：

3、随后直接在你的网页源码的适当位置粘贴前面复制的JS代码，再根据你的需求做响应修改。代码及相关注释示例如下：

<script type="text/javascript" src="//1e.t4m.cn/applink.js"></script>
/*
* MobLink 支持数组=>MobLink([...]) 和对象=>MobLink({...}) 两种初始化形式
* 页面上有多个元素需要跳转时使用数组方式,仅单个元素需要跳转时可以使用对象的方式进行初始化
* el: 表示网页上Element的id值,该字段为空或者不写,则表示MobLink **默认浮层** 上的打开按钮(注意:该字段支持selector方式: 1.'.class' 2.'#id1' 3.['#id1','#id2'])
* path: 对应App里需要恢复页面的路径
* default: 指定分享页默认场景参数（最多只能指定一项作为默认场景参数）
* params: 网页需要带给客户端的参数
* loadDataType: 配置是否加loading，配置代表加入loading，不配置则没有loading动效(eg：loadDataType:'1')
*/
// 页面上仅单个元素需要跳转时可以使用对象方式进行初始化
MobLink({
  el: '',
  path: 'demo/a',
  default: true,
loadDataType:'1',//配置是否加loading，配置代表加入loading，不配置则没有loading动画
  params: {
      key1: 'value1',
      key2: 'value2',
  }
 });

 // 页面上有多个元素需要跳转时要使用数组方式进行初始化
MobLink([
  {
      el: '',
      path: 'demo/a',
      params: {
          key1: 'value1',
          key2: 'value2',
      }
  },
  {
      el: '#openAppBtn1',
      path: 'demo/b',
      params: {
          key1: 'value1',
          key2: 'value2',
      }
  },
  {
      el: '#openAppBtn2',
      path: 'demo/c',
      params: {
          key1: 'value1',
          key2: 'value2',
      }
  }
 ]);
</script>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50

多渠道下载配置（可选）

当你的app包需要分发在多个不同的平台或者渠道托管的时候，如果你希望不同的活动页面引导用户去不同的渠道下载，那么此时可以使用MobLink提供的多渠道下载功能，具体使用步骤如下：

1、开发者后台配置下载渠道打开最新的开发者后台，在MobLink的基础配置页面下方有一个 渠道配置 模块，如下图：

点击该模块右上方的 添加多渠道下载地址 按钮即可添加下载地址，如下图：

准确填写好信息之后点击 确定 即可。

2、获取渠道标识经过上面的配置之后即会在 多渠道下载地址 模块中生成一个下载地址记录，其中有一个MobLink自动为你生成的下载渠道标识，如下图：

复制该渠道标识，到下一步中使用。

3、在MobLink JS中配置渠道在页面的js中通过指定字段（iOS：moblink_source_ios 安卓：moblink_source_android）配置下载渠道，示例代码如下：

<script type="text/javascript" src="//1p.t4m.cn/applink.js"></script>
/*
* MobLink 支持数组=>MobLink([...]) 和对象=>MobLink({...}) 两种初始化形式
* 页面上有多个元素需要跳转时使用数组方式,仅单个元素需要跳转时可以使用对象的方式进行初始化
* el: 表示网页上Element的id值,该字段为空或者不写,则表示MobLink **默认浮层** 上的打开按钮(注意:该字段支持selector方式: 1.'.class' 2.'#id1' 3.['#id1','#id2'])
* path: 对应App里需要恢复页面的路径
* params: 网页需要带给客户端的参数
*/
// 页面上仅单个元素需要跳转时可以使用对象方式进行初始化
MobLink({
    el: '',
    path: 'demo/a',
    moblink_source_ios: '5e006d8affa42d7657c3f8f8',       //iOS下载渠道配置字段
    moblink_source_android: '5e006d9aaedf41217607edd3',   //安卓下载渠道配置字段
    params: {
        key1: 'value1',
        key2: 'value2',
    }
})
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

4、iOS客户端需要做的操作（需要在项目默认的plist文件里添加上指定字段：MobLink_Channel，并配置上值，值就是后台生成的渠道标识，复制渠道标识使用），如下图：

自定义浏览器引导页（可选）

iOS端这里修改的是微信里跳转的界面，当app没有安装的时候，在微信里点击分享的链接，会先跳转到一个引导页，修改的是这里的，如下图：