H5跳转微信小程序方案

article/2025/6/22 6:19:21

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

开放对象:

  1. 已认证的服务号,服务号绑定“JS接口安全域名”下的网页可使用此标签跳转任意合法合规的小程序。
  2. 已认证的非个人主体的小程序,使用小程序云开发的静态网站托管绑定的域名下的网页,可以使用此标签跳转任意合法合规的小程序。

下面是具体步骤和代码:

1. 绑定域名

登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。

2. 引入JS文件

在需要调用JS接口的页面(index.html)引入如下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)

  //index.html  <script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>

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

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

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

4. 所需要的页面写入(vue为例)

        <wx-open-launch-weappid="launch-btn"username="gh_xxxxxxx" //此处为所需要的跳转的小程序原始idpath="" //path可以不传,但是传一定要加html后缀><script type="text/wxtag-template"><style>.btn { padding: 6px}</style><div class="btn">查看行程码</div></script></wx-open-launch-weapp>

如果页面报错找不到模板wx-open-launch-weapp,可以在main.js配置

//main.js
Vue.config.ignoredElements = ['wx-open-launch-weapp'];

5.功能实现效果

原文地址:微信h5跳转小程序 - 知乎

参考文章1:H5如何跳转微信小程序? | 微信开放社区

参考文章2:外部h5页面跳转微信小程序 - 简书

参考文章3:H5页面跳转微信小程序_风高物燥的博客-CSDN博客_h5跳转到微信小程序

参考文章4:H5跳转小程序_夜神夜神的博客-CSDN博客_h5跳转小程序


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

相关文章

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;单片机复位电路就好比电脑的…

51单片机的步进电机控制系统(仿真+程序+报告+原理图)

1、主要功能 该系统由AT89C51单片机数码管模块步进电机模块按键模块构成。 可实现功能: 1、按键控制步进电机正反转、加减速、停止&#xff1b; 2、2个发光二极管显示正反转&#xff0c;1位7段LED数码管显示当前转速档位&#xff08;共9个档位&#xff09;&#xff1b; 3、4个红…

51单片机电路原理图_(51单片机)课设项目2-超声波测距(SRF04、LCD1602、蜂鸣器报警电路)...

简单复盘一下做小项目时遇到的问题,下载地址在最后,有需要可以下载(在CSDN上我设置的是0C币下载,我发现好几次 会自己变??) 超声波模块SRF04 引脚 VCC:电源端 ECHO:接收端(高电平持续时间为超声波发出到返回的时间) TR:触发控制端,信号输入 NC(OUT):开关量输出…