微信H5跳转到APP开放标签wx-open-launch-app

接口代码配置并不复杂,最麻烦的是准备账号

一、条件说明

微信内访问网页时跳转到 APP条件:

  1. 服务号已认证
  2. 开放平台账号已认证
  3. 服务号与开放平台账号同主体

翻译一下就是:

  1. 微信公众平台 注册一个【服务号】并微信认证(¥300)
  2. 微信开放平台注册一个账号,并完成开发者资质认证(¥300)
  3. 最关键的是需要【服务号】和【开放平台账号】认证主体一致!不然前面的钱就打水漂了

二、文档

官方文档很详细,这里不做赘述

  1. 微信内网页跳转APP功能
  2. 微信开放标签说明文档
  3. App获取开放标签中的extinfo数据

三、重要的设置

1、微信公众平台设置IP白名单

该IP地址获取access_token

开发->基本配置->公众号开发信息->IP白名单

2、微信公众平台绑定安全域名

设置->公众号设置->功能设置->JS接口安全域名

3、微信开放平台绑定所需要跳转的App

这里也需要设置安全域名

管理中心 -> 公众帐号 -> 接口信息 -> 网页跳转移动应用 -> 关联设置中绑定所需要跳转的App

四、注意点

1、Android和iOS需要做好设置,才能拉起成功

2、几个重要参数的获取

  1. 开发者ID(AppID) 来自 微信公众平台
  2. 开发者密码(AppSecret) 来自 微信公众平台
  3. 移动应用Appid 来自微信开放平台

配置示例:

wx.config({
  debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印
  appId: '<开发者ID(AppID)>', // 必填,公众号的唯一标识
  timestamp: , // 必填,生成签名的时间戳
  nonceStr: '', // 必填,生成签名的随机串
  signature: '',// 必填,签名
  jsApiList: [], // 必填,需要使用的JS接口列表
  openTagList: [] // 可选,需要使用的开放标签列表,例如['wx-open-launch-app']
});
<wx-open-launch-app
  id="launch-btn"
  appid="<移动应用Appid>"
  extinfo="your-extinfo"
>
  <template>
    <style>.btn { padding: 12px }</style>
    <button class="btn">App内查看</button>
  </template>
</wx-open-launch-app>
已标记关键词 清除标记
©️2020 CSDN 皮肤主题: 编程工作室 设计师:CSDN官方博客 返回首页