小程序使用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;
}
刚试了下其实在该h5页面中使用parent.wx是可以正常使用的,那是不是我可以理解为wx在它的全局环境中内置了这个parent。以后是不是为了保险起见直接parent.wx调用sdk方法了?
6
如果只是 wx.miniProgram.getEnv判断没有生效呢
还得是你,这个问题我困扰了一上午,我加log能够看到wxsdk但是就是无法生效,后来用了你的方法就可以了
牛逼啊 老哥
兄弟厉害,专门登陆给你点赞的
我页面用的frame,根据你的方法。还是调不起。开发工具可以调起。调试发现走到wx.miniProgram.getEnv后没有任何反应,没有回调。这是什么原因啊?
真的感谢,找了一上午,还得是大佬你!
if(ua.match(/MicroMessenger/i)=="micromessenger") { 这边确定没问题吗,match返回的数组可以和字符串相等