[移动开发]js判断H5是否在小程序、微信中，webview中。

判断是否在微信中

 var ua = navigator.userAgent.toLowerCase();
 if (ua.match(/MicroMessenger/i) == "micromessenger") {
	//在微信中
 }

判断网页是否在小程序中

• 判断是网页是否在小程序中的webview中，官方提供了两个判断函数。

// web-view下的页面内 函数1
function ready() {
  console.log(window.__wxjs_environment === 'miniprogram') // true
}
if (!window.WeixinJSBridge || !WeixinJSBridge.invoke) {
  document.addEventListener('WeixinJSBridgeReady', ready, false)
} else {
  ready()
}

// 函数2
wx.miniProgram.getEnv(function(res) {
  console.log(res.miniprogram) // true
})

• 但是这两个函数都有缺陷，第一个函数社区开发者反应兼容性不好，ios和安卓有差异。第二个函数比较坑，是异步的。。。 但是准确度要高于第一个函数。所以还是推荐第二个函数。

推荐第二个函数，优化后的写法为这样

//函数
function isWx() {
    var ua = navigator.userAgent.toLowerCase();
    if (ua.match(/MicroMessenger/i) == "micromessenger") {
      return new Promise(resolve => {
        wx.miniProgram.getEnv(function(res) {
          if (res.miniprogram) {
            resolve("mini-wx");
          } else {
            resolve("wx");
          }
        });
      });
    } else {
      console.log("不在微信里");
      return new Promise(resolve => {
        resolve("no-wx");
      });
    }
  }
//调用
isWx().then(type => {
   if (type == "wx") {
     console.log("这是微信环境中");
   }
 });

注意：如果webview中有使用iframe，iframe中有涉及用到jssdk，那么可能会失效，需要在调用的地方加上parent。

wx.choose 要改为 parent.wx.choose。//前提是webview中已经引入了jssdk

创作打卡挑战赛

赢取流量/现金/CSDN周边激励大奖