小程序使用webview嵌套H5真机无法跳转 wx.miniProgram.getEnv、wx.miniProgram.navigateTo等失效无响应问题分享
原因分析:由于页面使用了iframe导致在子页面中真机无法准确获取页面运行环境(开发者工具中无影响);
解决方案:在调用方法前加一个 parent. 在父页面中调用方法即可正常运行;
过程:尝试过切换jweixin代码版本但是问题依旧;
分享:遇到同类问题用这个方法解决了的小伙伴欢迎评论区留言点赞👍!
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
核心代码:
var ua = navigator.userAgent.toLowerCase();
if(ua.match(/MicroMessenger/i)=="micromessenger") {
//由于页面是iframe 所以在调用wx.miniProgram.getEnv的时候直接调用会没反应,需要加一个parent父组件调用即可成功调起来。(开发者工具可以成功跳转但是真机没办法跳转1.3.2-1.6.0的js都试过问题依旧)
parent.wx.miniProgram.getEnv((res)=>{
if (res.miniprogram) {
// alert("在微信内,在小程序内")
// console.log('在小程序内')
// alert("在小程序内")
parent.wx.miniProgram.navigateTo({
url: "/pages/minipay/minipay?outTradeNo="+outTradeNo+"&type=miniapp&code=" , //小程序的支付地址,queryParam是需要传递的商品id等数据
fail: function(err){
alert("跳转小程序失败!")
},
});
return false;
}
else{
alert("在微信内,但是不在小程序内")
console.log('在微信内,但是不在小程序内')//嵌入公众号
return false;
}
})
}
else{
console.log('在微信外')
if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
console.log("移动")
// 支付在同一页面打开
// return;
} else {
console.log("PC")
// 支付在同一页面打开
// return;
}
return false;
}
感谢老哥,解决了一个困扰很久的问题,iframe里在真机的点击事件无效