小程序与H5如何互相跳转

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了小程序与H5如何互相跳转相关的知识,希望对你有一定的参考价值。

参考技术A 需要用到小程序的web-view, 官方文档链接

web-view是承载网页的容器。会自动铺满整个小程序页面,个人类型的小程序暂不支持使用。写法如下:

注:当在微信开发中工具里返回“"base_resp":"ret":-1”时,需要点左上角“设置”--“项目设置”--勾选“不校验合法域名、web-view(业务域名)、TLS 版本以及 HTTPS 证书”

因为外部h5无法跳转到小程序,因此需要把h5内嵌到小程序的web-view中。
一:首页小程序内嵌h5网页,内嵌这一步就相当于上面的小程序跳转h5:

二:然后在内嵌的网页里引入js,调用wx.miniProgram.navigateTo跳转小程序方法,可在url后拼接要传的参数:

三:小程序接受参数的页面:
index.wxml:

index.js

这样就从h5跳到小程序指定的页面并且可以拿到我们想要传的参数

原文作者技术博客: https://www.jianshu.com/u/ac4daaeecdfe
95后前端妹子一枚,爱阅读,爱交友,将工作中遇到的问题记录在这里,希望给每一个看到的你能带来一点帮助。
欢迎留言交流

以上是关于小程序与H5如何互相跳转的主要内容,如果未能解决你的问题,请参考以下文章

vue项目-h5跳转小程序

H5跳转小程序,可以跳转任意小程序,以及任意小程序的页面地址获取。

小程序预备课--初探小程序

微信小程序 h5页面跳转小程序(超详细讲解)

微信公共号H5页面跳转小程序。

微信小程序web-view环境下H5跳转小程序页面方法