小程序使用webview嵌套H5中使用iframe真机无法跳转 wx.miniProgram.getEnv等失效问题分享
发布于 4 年前 作者 xiulanliang 4984 次浏览 来自 分享

小程序使用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;
}
回到顶部