1、背景
公司官网有介绍自己app的产品页面,里面放了一个二维码,本想让用户扫描那个二维码直接下载的,可是测试时发现微信、钉钉不让直接下载,这个时候就需要判断用户是用什么浏览器打开的,如果是微信 或钉钉打开的,提醒用户点击右上角按钮打开手机浏览器再下载。
解决方案
h5页面判断是否是微信浏览器 或 钉钉浏览器,是的话弹框提醒 点击右上角打开浏览器去下载,否则直接让用户点击按钮进行下载。如图:
// 判断是否是微信浏览器 或钉钉浏览器代码
function isWeiXin() {
let ua = window.navigator.userAgent.toLowerCase();
if (ua.match(/MicroMessenger/i) == 'micromessenger' || ua.match(/ding\s?talk/i)) {
return true; // 是微信端 或 钉钉端
} else {
return false;
}
}
其他参考代码:
var isMobile = !!ua.match(/AppleWebKit.*Mobile/i) ||
!!ua.match(
/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-|Nokia|SonyEricsson|SIE-|Amoi|ZTE/
); //是否为移动终端
//移动终端浏览器版本信息
trident: ua.indexOf("Trident") > -1, //IE内核
presto: ua.indexOf("Presto") > -1, //opera内核
webKit: ua.indexOf("AppleWebKit") > -1, //苹果、谷歌内核
gecko: ua.indexOf("Gecko") > -1 && u.indexOf("KHTML") === -1, //火狐内核
mobile: isMobile,
ios: !!ua.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
android: ua.indexOf("Android") > -1 || u.indexOf("Linux") > -1, //android终端或者uc浏览器
iPhone: ua.indexOf("iPhone") > -1 || u.indexOf("Mac") > -1, //是否为iPhone或者QQHD浏览器
iPad: ua.indexOf("iPad") > -1, //是否iPad
webApp: ua.indexOf("Safari") === -1, //是否web应该程序,没有头部与底部
weixin: !!ua.match(/MicroMessenger/i), //是否是微信内打开
isMobileDing: !!ua.match(/ding\s?talk/i) && isMobile, //是否是钉钉内打开
isPCDing: !!ua.match(/ding\s?talk/i) && !isMobile,
isDing: !!ua.match(/ding\s?talk/i),