- web-view嵌套的h5页面如何跳转到小程序?
之前利用web-view嵌套了一个网页,做了个小程序,现在想在这个网页里加个文字或者图片,让用户点击可以直接打开另一个小程序,请问有没有办法实现?如何实现?技术有限,还请大佬们说清楚一点,感谢! [图片]
2021-05-25 - 小程序webview中不能跳转到小程序原生页面?
在小程序中通过webview嵌套h5页面(aaa.com),在当前h5页面中可以通过微信的sdk可以正常跳转到小程序原生页,当在嵌套的h5中通过location.href跳转到其他(bbb.com)时, 后面再跳转小程序原生页时 将无法跳转。?? 当前sdk版本1.3.2 更换其他sdk版本也无法解决 wx_app_sdk1_3_2.js 通过这种方式跳转到小程序原生页面: mpUtils.navigateTo({ url: res, success(success) { console.log('success--', success) }, fail(fail) { console.log('fail--', fail) }, complete(complete) { console.log('complete--', complete) } }) 补充一下: 发现只要在webview中 通过location.href跳转后再回到原来页面,就不能跳转到小程序原生页了, location.href跳转后不回到之前页面,则可以跳转到小程序原生页面。
2021-04-12 - webview跳转小程序的另一种实现
起因 因为公司业务原因,小程序嵌套了大量的h5页面供; 但涉及到支付类的操作必须在小程序原生页面完成; 这就牵扯了webview跳转原生小程序问题; 我们在线上经常遇到用户投诉;在webview页面点去支付没有反应; 代码逻辑上,这个按钮点击应该跳转原生页面才对的; 我们也在相关页面添加了日志,显示已经触发jssdk成功跳转回掉 但是并没有跳转成功 就在前几天我们又接到用户关于跳转失败投诉; 这种收到反馈,搜集微信日志,联系官方的操作过于被动; 每次都要被公司质量管控部门吐槽,有苦难言; 社区也有不少开发者反馈相关问题;但是偶现bug,官方也不易排查 所以除了等待官方解决我们就没有别的办法了么? 突破 就在我辗转反侧,彻夜难眠的时候,官方文档的一句话吸引了我 [图片] 每次网页加载都能触发bindload事件获取到url 那么我们能不能指定一个url,获取url上的指定的参数,利用小程序原生能力进行跳转呢 实现 wxml 页面添加bindload事件监听 [代码]<web-view src="{{url}}" bindload="load"></web-view> [代码] js 监听url中的变化,检测到指定值执行跳转逻辑 [代码]load: function (e) { // 获取url const src = e.detail.src; const query = src.split('?')[1] || ''; // 检测url参数中是否有指定的参数 const isJump = query.indexOf('word=jump'); // 检测到指定值执行跳转逻辑 if(isJump >= 0){ wx.navigateTo({ url: '/index/index' }) } } [代码] demo 这里写了一个简单的demo https://developers.weixin.qq.com/s/HCPpEzmU7DkV 嵌入了触屏的baidu 当监听到搜索关键词为jump时,会执行原生的跳转 [图片] 兼容性的问题 因为公司小程序基础库是2.9.2,大于等于这个版本的可靠性是经过我们线上验证的 低于2.9.2的基础库版本有待考证,可能需要使用者自测 这里给大家提供一种思路,可以结合场景使用 安卓微信8.0.1,出现webview bindload没有执行的情况,这个api在新版本微信上可能有兼容性问题(20210322)
2021-08-13