浏览器HTML5页面或短信链接如何调用唤起微信小程序(URL Scheme)?

Written by

in

文章目录
  • 背景:用于实现外部H5页面中实现打开微信小程序的功能(微信内打开请使用微信开放标签方式),用户在网页中一键唤起小程序,能够给用户提供更好的体验。采用的技术是URL Scheme,是微信小程序后台生成一种地址,适用于从短信、邮件、微信外网页等场景打开小程序任意页面,即点击微信外部链接,唤起微信,打开中转页面,从中转页面进入小程序。通过URL Scheme打开小程序的场景值为 1065。 整体思路:前端调用后端接口,后端调用微信接口生成Url Scheme返回给前端,前端得到Url Scheme后,打开该链接即可实现跳转生成的 URL Scheme 如下所示 location.href = ‘weixin://dl/business/?t=SagndxolUds’
  • 自 2023 年 12 月 19 日起,对URL Scheme进行升级,详细调整说明可见《URL Scheme 和 URL Link优化公告》。改动点概览如下: 支持开发者在原有加密 URL Scheme 后面拼接参数; 新增明文 URL Scheme,开发者无需调用接口可自行拼接生成明文Scheme; 取消 URL Scheme 一人一链的限制,支持同一条连接被多名用户访问; 每个小程序每天 URL Scheme 和 URL Link 总打开次数上限为300万。 
  • 在微信生态系统中,H5(HTML5)页面与微信小程序之间的交互是常见且重要的功能。这一功能使得用户在浏览H5网页时可以无缝地切换到微信小程序,享受更丰富的服务和体验。 到此这篇关于浏览器HTML5页面或短信链接如何唤起微信小程序(URL Scheme)?的文章就介绍到这了,更多相关HTML5或短信链接打开微信小程序内容请搜索风君子博客以前的文章或继续浏览下面的相关文章希望大家以后多多支持风君子博客! 您可能感兴趣的文章: 使用微信小程序API,调用微信的各种内置能力。 微信小程序如何调用新闻接口实现列表循环 微信小程序如何调用图片接口API并居中显示 微信小程序如何调用json数据接口并解析 微信小程序调用微信登陆获取openid及java做为服务端示例 微信小程序调用PHP后台接口 解析纯html文本
  • 目录
    • 介绍
    • 获取 URL Scheme
    • 操作步骤
      • 开发前的准备工作
      • 获取access_token
      • 生成URL Scheme
    • 备注笔记
      • 频率限制
      • 注意事项
      • 开放范围
    • 总结

      • 背景:用于实现外部H5页面中实现打开微信小程序的功能(微信内打开请使用微信开放标签方式),用户在网页中一键唤起小程序,能够给用户提供更好的体验。采用的技术是URL Scheme,是微信小程序后台生成一种地址,适用于从短信、邮件、微信外网页等场景打开小程序任意页面,即点击微信外部链接,唤起微信,打开中转页面,从中转页面进入小程序。通过URL Scheme打开小程序的场景值为 1065。
      • 整体思路:前端调用后端接口,后端调用微信接口生成Url Scheme返回给前端,前端得到Url Scheme后,打开该链接即可实现跳转
        生成的 URL Scheme 如下所示
      location.href = 'weixin://dl/business/?t=SagndxolUds'
      

      自 2023 年 12 月 19 日起,对URL Scheme进行升级,详细调整说明可见《URL Scheme 和 URL Link优化公告》。改动点概览如下:

      支持开发者在原有加密 URL Scheme 后面拼接参数;

      新增明文 URL Scheme,开发者无需调用接口可自行拼接生成明文Scheme;

      取消 URL Scheme 一人一链的限制,支持同一条连接被多名用户访问;

      每个小程序每天 URL Scheme 和 URL Link 总打开次数上限为300万。
       

      必须是企业的小程序

      • 获取AppID,也就是小程序唯一凭证,可在微信公众平台 – 设置 – 开发设置」页中获得。(需要已经成为开发者,且帐号没有异常状态)
      • 获取AppSecret,也就是小程序唯一凭证密钥

      关于URL Scheme
      微信官方文档:https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/url-scheme.html
      后端

      • 代码逻辑:后端调用微信接口获取access_token,在用获取access_token去调用微信接口生成URL Scheme,在将URL Scheme返回给前端

      微信官方文档https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/access-token/auth.getAccessToken.html

      • 请求地址
      GET https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=APPSECRET
      
      • 参数列表:
      参数 含义
      grant_type 固定为client_credential
      appid 小程序唯一凭证,即 AppID
      secret 小程序唯一凭证密钥,即 AppSecret
      • 得到以下数据说明成功:
      {"access_token": "56_iut0Umy6*********wERTaAHAVIK", "expires_in": 7200}
      

      微信官方文档:https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/url-scheme/urlscheme.generate.html

      • 请求地址
      POST https://api.weixin.qq.com/wxa/generatescheme?access_token=ACCESS_TOKEN
      
      • 参数列表:
      参数 含义
      access_token 接口凭证
      • 得到以下数据说明成功:
      {
          "errcode": 0,
          "errmsg": "ok",
          "openlink": "weixin://dl/business/?t=SagndxolUds"
      }
      

      此时已经拿到了openlink ,也就是URL Scheme,将该信息返回前端即可

      前端
      请求后端接口拿到URL Scheme,然后已URL形式打开即可,该方式仅支持手机浏览器,如果是微信浏览器则需要使用(微信开放标签)方式

      <a href="weixin://dl/business/?t=SagndxolUds" rel="external nofollow" >打开小程序</a>
      

      href 绑定的是 URL Scheme 地址。

      生成端:每天生成 URL Scheme(加密+明文) 和 URL Link 的总数量上限为50万;

      打开端:每天通过 URL Scheme(加密+明文) 和 URL Link 打开小程序的总次数上限为300万。

      微信内的网页如需打开小程序请使用微信开放标签-小程序跳转按钮,无公众号也可以直接使用小程序身份开发网页并免鉴权跳转小程序,见云开发静态网站跳转小程序。符合开放范围的小程序可以下发支持打开小程序的短信
      该功能基本覆盖当前用户正在使用的微信版本,开发者无需进行低版本兼容
      只能生成已发布的小程序的 URL Scheme
      通过 URL Scheme 跳转到微信时,可能会触发系统弹框询问,若用户选择不跳转,则无法打开小程序。请开发者妥善处理用户选择不跳转的场景
      部分浏览器会限制打开网页直接跳转,可参考示例网页设置跳转按钮
      平台有安全策略防止开发者的链接被黑灰产批量打开,导致的达到访问上限无法正常打开小程序的问题

      针对非个人主体小程序开放。

      在微信生态系统中,H5(HTML5)页面与微信小程序之间的交互是常见且重要的功能。这一功能使得用户在浏览H5网页时可以无缝地切换到微信小程序,享受更丰富的服务和体验。

      到此这篇关于浏览器HTML5页面或短信链接如何唤起微信小程序(URL Scheme)?的文章就介绍到这了,更多相关HTML5或短信链接打开微信小程序内容请搜索风君子博客以前的文章或继续浏览下面的相关文章希望大家以后多多支持风君子博客!

      您可能感兴趣的文章:

      • 使用微信小程序API,调用微信的各种内置能力。
      • 微信小程序如何调用新闻接口实现列表循环
      • 微信小程序如何调用图片接口API并居中显示
      • 微信小程序如何调用json数据接口并解析
      • 微信小程序调用微信登陆获取openid及java做为服务端示例
      • 微信小程序调用PHP后台接口 解析纯html文本

      站内搜索