h5-浏览器点击跳转微信小程序或微信内部广告页(微信浏览器)跳转小程序的实现方法。

article/2025/6/22 6:24:45

一.微信内部浏览器使用<微信开放标签>唤起微信小程序

官方开发文档:[https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/url-scheme.html](%5Bhttps://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/url-scheme.html%5D%28https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/url-scheme.html%29)
之前我也跟着开发文档走,发现遇到很多坑。

1. 绑定域名

登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。
↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑
指的是要绑定可访问的安全域名,类似你想在 http://www.baidu.com/demo.html这个页面打开微信小程序,那么你就需要绑定www.baidu.com这个域名

2. 引入JS文件

在需要调用JS接口的页面引入如下JS文件:http://res.wx.qq.com/open/js/jweixin-1.6.0.js (支持https)
如需进一步提升服务稳定性,当上述资源不可访问时,可改访问:http://res2.wx.qq.com/open/js/jweixin-1.6.0.js (支持https)
备注:支持使用 AMD/CMD 标准模块加载方法加载。
↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑
这一块没什么注意的,引入就完事了。

3. 通过config接口注入权限验证配置并申请所需开放标签

与使用JS-SDK配置方式相同,所有需要使用开放标签的页面必须先注入配置信息,并通过openTagList字段申请所需要的开放标签,否则将无法使用(同一个url仅需调用一次)。开放标签的申请和JS接口的申请相互独立,因此是可以同时申请的。

        wx.config({debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印appId: '', // 必填,公众号的唯一标识    //后台返还timestamp: '', // 必填,生成签名的时间戳    //后台返还nonceStr: '', // 必填,生成签名的随机串    //后台返还signature: '',// 必填,签名    //后台返还jsApiList: [], // 必填,需要使用的JS接口列表 可选'chooseImage'等openTagList: [] // 可选,需要使用的开放标签列表,例如['wx-open-launch-app']   });

签名的相关信息可以通过https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html#62
让后端请求相关接口获取
↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑
这一块也没什么坑吧,把相关数据放入即可。

4. 通过ready接口处理成功验证

        wx.ready(function () {// config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后,config是一个客户端的异步操作,所以如果需要在页面加载时就调用相关接口,则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口,则可以直接调用,不需要放在ready函数中});

5. 通过error接口处理失败验证

        wx.error(function (res) {// config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名});

把上述数据配置好即可,就可以实现微信浏览器唤起微信小程序了。当然这里也有官方提供的例子。
大家可以参考进行配置。
https://postpay-2g5hm2oxbbb721a4-1258211818.tcloudbaseapp.com/jump-mp.html

二.微信外部浏览器使用URL Scheme唤起微信小程序

官方开发文档:https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/url-scheme.html

通过服务端接口或在小程序管理后台「工具」-「生成 URL Scheme」入口可以获取打开小程序任意页面的 URL Scheme。适用于从短信、邮件、微信外网页等场景打开小程序。 通过 URL Scheme 打开小程序的场景值为 1065。

直接使用如下代码就可以在外部浏览器打开微信小程序,当然也可以在点击的时候触发下列的事件。
iOS系统支持识别 URL Scheme,可在短信等应用场景中直接通过Scheme跳转小程序。
Android系统不支持直接识别 URL Scheme,用户无法通过 Scheme 正常打开小程序,开发者需要使用 H5 页面中转,再跳转到 Scheme 实现打开小程序,跳转代码示例如下:

 location.href = 'weixin://dl/business/?t= *TICKET*'

服务端获取方法:https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/url-scheme/urlscheme.generate.html

首先请求https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=APPSECRET
拿到access_token,再使用access_token请求https://api.weixin.qq.com/wxa/generatescheme?access_token=ACCESS_TOKEN来拿到对应的URL Scheme,如下图。
请添加图片描述
请添加图片描述
请添加图片描述
请添加图片描述
最后我们可以通过上述的两个接口,拿到我们想要的link,如这样weixin://dl/business/?t= TICKET的形式,直接打开即可。
↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑
需要注意的是,这个方法只能在微信外部浏览器使用,微信内部浏览器需要使用微信开放标签,另外安卓和ios是有区别得。

展示效果如图所示

请添加图片描述

欢迎大家交流,有问题可以直接评论提出。


http://chatgpt.dhexx.cn/article/ELHXaAtL.shtml

相关文章

H5跳转微信公众号解决方案

1.适用场景 适用H5跳转公众号的场景 2.跳转方案 微信内H5跳转 微信内可链接直接跳转公众号关注页。 登陆微信公众平台&#xff0c;F12打开浏览器控制台console输入wx.commonData.data.uin_base64 https://mp.weixin.qq.com/mp/profile_ext?actionhome&__biz上方步骤…

H5跳转微信小程序方案

开发中涉及到一个需求&#xff0c;就是从一个预约票购买的页面 需要跳转到 查看行程轨迹 的小程序。试过其他方法才知道微信h5或小程序中是无法直接跳转到小程序的。这里微信提供了一个开放标签&#xff0c;wx-open-launch-weapp&#xff0c;通过它可以满足需求。 开放对象&am…

ofo否认破产:目前运营正常 有关债务正在诉讼或协商中

【TechWeb】4月2日消息&#xff0c;近日&#xff0c;ofo运营主体之一北京拜克洛克科技有限公司现身全国企业破产重整案件信息网&#xff0c;对此&#xff0c;ofo发布声明回应称&#xff0c;“有关ofo破产的新闻严重失实。ofo目前运营一切正常&#xff0c;有关债务也在诉讼或者协…

破产清算对法定代表人的影响是什么

一、破产清算对法定代表人的影响是什么? 破产清算对法定代表人的影响是&#xff0c;很有可能在该企业破产清算完结之日起3年内不能做其他企业的法定代表人。 《企业法人法定代表人登记管理规定》 第四条 有下列情形之一的&#xff0c;不得担任法定代表人&#xff0c;企业登…

《企业破产法》

《企业破产法》之破产重整 基础概念 破产重整的企业&#xff0c;企业法人资格不注销&#xff0c;继续存续&#xff0c;不是让企业关门大吉、退出市场&#xff0c;而是通过对债务人企业实施债务、资产、业务、股权、管理等全方位的重组&#xff0c;找准企业出问题的原因并提出…

企业破产法6

重整程序 可能/已经具备破产原因 不能履行到期债务资产不足以清偿全部债务/明显缺乏偿债能力 明显丧失偿债能力可能的&#xff08;专用于重整&#xff09; 重整程序 取回权与破产不同 不能提前 重整计划通过 1/2人数2/3债权全部分组 法院强行批准 重整计划草案符合法定条…

破产清算与注册资金有关系吗

破产清算与注册资金有关系吗 首先要区分一下注册资本和公司财产的概念。注册资本是全体股东认缴的出资额&#xff0c;是公司资产的一部分;公司财产是包括注册资本及公司在生产经营过程中累计的所有财产的总和。破产清算时&#xff0c;清算的是公司的财产和债务&#xff0c;因此…

美国历史最大10宗破产保护

美国历史最大10宗破产保护 来源&#xff1a;http://www.ruanyifeng.com/blog/2008/09/biggest_chapter_11_cases.html 9月15日&#xff0c;美国最大的投资银行之一——雷曼兄弟公司——申请破产保护。 当天&#xff0c;CNBC就做了一个专题《美国历史上最大的10宗破产保护》&am…

PJzhang:贷款逾期与失信被执行人

猫宁&#xff01;&#xff01;&#xff01; 最近看到一家网贷机构在APP上的温馨提示&#xff0c;提到了网贷逾期与个人征信的关系以及向客户发放贷款的7项基本原则。 如下&#xff1a; 贷款申请及逾期告知 尊敬的客户&#xff0c;感谢您选择####股份有限公司为您提供贷款金融服…

消失的2000万辆小黄车去哪儿了?

在过去几个月&#xff0c;ofo及经营主体东峡大通频频爆出“新闻”&#xff1a;在全国企业破产重整案件信息网上“被申请”&#xff0c; 被法院作出“限制消费令”及被列为失信被执行人&#xff0c; 未能达到广州市“共享单车招标公告”要求&#xff0c;押金退还问题持续被用户投…

欠债1469亿北大光环消失,方正集团破产重整

点击 机器学习算法与Python学习 &#xff0c;选择加星标 精彩内容不迷路 本文转自36氪 顶着北京大学光环成立的方正集团终于要破产重组了。 近日&#xff0c;方正集团及其四家子公司“资产出售式”合并重整方案获表决通过。 据破产重整清产核资审计报告&#xff0c;截至审计基准…

快播王欣最新项目大揭秘!

来源: 链虎财经 9月4日&#xff0c;随着各大媒体纷纷报道快播破产清算的消息&#xff0c;快播创始人王欣又一次站到公众眼前。王欣此次回归可谓是有备而来&#xff0c;这一次&#xff0c;他会给我们带来怎样的惊喜呢&#xff1f; 据9月3日全国企业破产重整案件信息网披露&am…

ofo 寸步难行

作者 | 邱智丽 本文经授权转载自第一财经&#xff08;ID&#xff1a;cbn-yicai&#xff09; 昨日起&#xff0c;陆续有媒体报道称&#xff0c;从全国企业破产重整案件信息网获悉&#xff0c;ofo运营主体之一北京拜克洛克科技有限公司作为“被申请人”而出现&#xff0c;申请人为…

你欠快播的会员,可能要充到区块链上了

“我放下过天地,却从未放下过你。” ——中国“最有种”的男人王欣 今日,全国企业破产重整案件信息网披露,深圳金亚太科技有限公司对快播提出破产清算申请,广东省深圳市中级人民法院裁定该申请即日起生效。裁定时间为2018年8月23日。 裁定书截图 根据裁定书披露,快播公…

Oracle中decode函数用法解析以及常用场景

1.decode函数的两种形式 第一种形式 含义解释&#xff1a; decode(条件,值1,返回值1,值2,返回值2,…值n,返回值n,缺省值) 该函数的含义如下&#xff1a; IF 条件值1 THENRETURN(翻译值1) ELSIF 条件值2 THENRETURN(翻译值2)...... ELSIF 条件值n THENRETURN(翻译值n) ELSER…

oracle+decode函数用法,oracle中decode函数用法

oracle中decode函数用法以下文字资料是由(历史新知网www.lishixinzhi.com)小编为大家搜集整理后发布的内容&#xff0c;让我们赶快一起来看一下吧&#xff01; DECODE函数相当于一条件语句(IF) 它将输入数值与函数中的参数列表相比较 根据输入值返回一个对应值 函数的参数列表是…

oracle decode函数用法详解

oracle的decode函数语法结构如下: decode (expression, search_1, result_1) decode (expression, search_1, result_1, search_2, result_2) decode (expression, search_1, result_1, search_2, result_2, ...., search_n, result_n) decode (expression, search_1, result_…

51单片机电路原理图_单片机晶振的必要性

单片机工作时&#xff0c;是一条一条地从ROM中取指令&#xff0c;然后一步一步地执行。单片机访问一次存储器的时间&#xff0c;称之为一个机器周期&#xff0c;这是一个时间基准。一个机器周期包括12个时钟周期。如果一个单片机选择了12MHZ晶振&#xff0c;它的时钟周期是1/12…

51单片机电路原理图_51单片机最小系统电路设计

51单片机最小系统具有体积小、质量轻、功能强、功耗低、性价比高等特点。由芯片、系统时钟、I/O端口设备及复位电路等构成。 电子学习资料大礼包​mp.weixin.qq.com 51单片机是STC公司开发制造的一种8位微控制芯片&#xff0c;拥有512字节的数据存储空间和8K字节的程序存储空间…

基于51单片机智能电子秤方案原理图程序设计

硬件设计 &#xff08;文末附资料&#xff09; 单片机最小系统 对51系列单片机来说&#xff0c;最小系统一般应该包括:单片机、晶振电路、复位电路。下面给出一个51单片机的最小系统电路图。 复位电路&#xff1a; 一、复位电路的用途&#xff1a;单片机复位电路就好比电脑的…