如何使在微信公众号中开发的网页只能够在微信浏览器中运行

众所周知,微信公众号中的网页开发跟普通的手机端网页开发是一样的,都是通过网址来进行浏览的,不同的是,在很多微信网页中,选择在浏览器打开该页面的时候会出现错误,提示
你只能使用微信打开该页面,其实这个判断很简单,只需要一段js就可以实现了。

该方法就是使用UA来判断,代码如下:

1
2
3
4
5
6
var ua = navigator.userAgent.toLowerCase();
var isWeixin = ua.indexOf('micromessenger') != -1;
if (!isWeixin) {
document.head.innerHTML = '<title>抱歉,出错了</title><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0"><link rel="stylesheet" type="text/css" href="https://res.wx.qq.com/connect/zh_CN/htmledition/style/wap_err1a9853.css">';
document.body.innerHTML = '<div class="page_msg"><div class="inner"><span class="msg_icon_wrp"><i class="icon80_smile"></i></span><div class="msg_content">请在微信客户端打开链接 </div></div></div>';
}

分享到