本文介绍如何使用JavaScript检测当前页面是否在微信浏览器中打开。通过解析navigator.userAgent，识别MicroMessenger标识，实现非微信环境下的页面跳转提示。示例代码涵盖微信、微博、QQ及移动端设备类型的判断逻辑，并提供相关在线检测工具链接。
微信浏览器判断与跳转逻辑
本文介绍一种利用JavaScript判断页面是否在微信浏览器中打开的简单方法，供读者参考。
在HTML5项目开发中，页面常通过微信、微博等社交网络分享，并在分享页提供APP下载链接。然而，部分应用内浏览器不支持直接下载，此时需引导用户前往Safari或系统自带浏览器打开页面。借助JavaScript，可以检测当前页面的浏览器环境。
<script>
var ua = navigator.userAgent.toLowerCase();
var isWeixin = ua.indexOf('micromessenger') != -1;
if (!isWeixin) {
window.location.href = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=888"
}
</script>若页面未在微信内部打开，系统将跳转至指定提示页面。代码中的appid为必填项，具体数值可随意设定，或使用已获取的有效ID。
采用跳转方式有助于防止他人直接查看源代码。
以下示例代码展示了如何通过JavaScript判断页面是否在微信、QQ空间或新浪微博中打开。此外，可进一步完善逻辑，增加对移动设备与PC端的区分，甚至细化判断安卓或iOS系统。
多浏览器与环境检测实现
if (browser.versions.mobile) {//判断是否是移动设备打开。browser代码在下面
var ua = navigator.userAgent.toLowerCase();//获取判断用的对象
if (ua.match(/MicroMessenger/i) == "micromessenger") {
//在微信中打开
}
if (ua.match(/WeiBo/i) == "weibo") {
//在新浪微博客户端打开
}
if (ua.match(/QQ/i) == "qq") {
//在QQ空间打开
}
if (browser.versions.ios) {
//是否在IOS浏览器打开
}
if(browser.versions.android){
//是否在安卓浏览器打开
}
} else {
//否则就是PC浏览器打开
}
附上browser对象代码，该方法可用于识别多种浏览器，包括IE、Opera、Safari、Chrome及Firefox等。
var browser = {
versions: function () {
var u = navigator.userAgent, app = navigator.appVersion;
return { //移动终端浏览器版本信息
trident: u.indexOf('Trident') > -1, //IE内核
presto: u.indexOf('Presto') > -1, //opera内核
webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核
gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐内核
mobile: !!u.match(/AppleWebKit.*Mobile.*/), //是否为移动终端
ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android终端或uc浏览器
iPhone: u.indexOf('iPhone') > -1, //是否为iPhone或者QQHD浏览器
iPad: u.indexOf('iPad') > -1, //是否iPad
webApp: u.indexOf('Safari') == -1 //是否web应该程序，没有头部与底部
};
}(),
language: (navigator.browserLanguage || navigator.language).toLowerCase()
}
此外，提供几款相关在线工具供参考：
在线浏览器信息检测工具： http://tools.jb51.net/aideddesign/browser_info
常用浏览器(PC,移动) user-agent： http://tools.jb51.net/table/useragent
更多关于JavaScript相关内容感兴趣的读者可查看本站专题：《JavaScript事件相关操作与技巧大全》、《JavaScript页面元素操作技巧总结》、《JavaScript操作DOM技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript错误与调试技巧总结》
希望本文所述对大家JavaScript程序设计有所帮助。