评论

小程序使用webview嵌套H5中使用iframe真机无法跳转 wx.miniProgram.getEnv等失效问题分享

小程序使用webview嵌套H5真机无法跳转 wx.miniProgram.getEnv、wx.miniProgram.navigateTo等失效无响应问题分享

小程序使用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;
}


最后一次编辑于  2020-12-21  
点赞 10
收藏
评论

10 个评论

  • _chen_
    _chen_
    2022-07-21

    刚试了下其实在该h5页面中使用parent.wx是可以正常使用的,那是不是我可以理解为wx在它的全局环境中内置了这个parent。以后是不是为了保险起见直接parent.wx调用sdk方法了?

    2022-07-21
    赞同 1
    回复
  • 给钱,谢谢!
    给钱,谢谢!
    06-19

    如果只是 wx.miniProgram.getEnv判断没有生效呢

    

    06-19
    赞同
    回复
  • 云层是天空的一封信
    云层是天空的一封信
    2023-04-11

    还得是你,这个问题我困扰了一上午,我加log能够看到wxsdk但是就是无法生效,后来用了你的方法就可以了

    2023-04-11
    赞同
    回复
  • 🍁 。
    🍁 。
    2023-04-06

    牛逼啊 老哥

    2023-04-06
    赞同
    回复
  • 捶捶
    捶捶
    2022-11-11

    兄弟厉害,专门登陆给你点赞的

    2022-11-11
    赞同
    回复
  • 李堂飞18722712295
    李堂飞18722712295
    2022-04-12

    我页面用的frame,根据你的方法。还是调不起。开发工具可以调起。调试发现走到wx.miniProgram.getEnv后没有任何反应,没有回调。这是什么原因啊?

    2022-04-12
    赞同
    回复
  • 旅途
    旅途
    2022-03-16

    真的感谢,找了一上午,还得是大佬你!

    2022-03-16
    赞同
    回复
  • 喂,小寒
    喂,小寒
    2022-01-13
    if(ua.match(/MicroMessenger/i)=="micromessenger") {
    这边确定没问题吗,match返回的数组可以和字符串相等
    
    2022-01-13
    赞同
    回复
  • Xu
    Xu
    2021-09-14
    你好我也是用iframe引入的 但是我没有加parent但是我的wx.miniProgram.navigateTo这个可以运行   但是wx.miniProgram.getEnv不可以运行
    


    2021-09-14
    赞同
    回复 2
    • ²⁰²¹
      ²⁰²¹
      2023-01-03
      一样的情况,最后怎么处理的,老哥
      2023-01-03
      回复
    • 🍁 。
      🍁 。
      2023-04-06回复²⁰²¹
      加个判断咯,有wx就直接用,没有就加parent
      2023-04-06
      回复
  • lfq
    lfq
    2021-05-22

    感谢老哥,解决了一个困扰很久的问题,iframe里在真机的点击事件无效

    2021-05-22
    赞同
    回复 1
    • SteveAndy
      SteveAndy
      2021-06-25
      🤝不客气,能帮到人就最好了。
      2021-06-25
      回复
登录 后发表内容