JavaScript判断系统和浏览器

在做项目的时候,Web端需要适配移动端,且部分参数需要判断对应系统或浏览器。

在IOS中,因为高版本的系统Safari浏览器采用了Mac的内核,所以导致普通的判断无法识别到对应系统。
(userAgent.match(/(Macintosh)/) && navigator.maxTouchPoints > 1) 能有效识别是apple产品,且是触屏的,通过此方法能识别高版本的IOS_Safari。

Navigator 接口的 maxTouchPoints 只读属性返回当前设备支持的最大同时触摸接触点数。

if (navigator.maxTouchPoints > 1) {
 // 浏览器支持多点触控
}

识别对应系统和浏览器代码:

/* 匹配系统 */
function detectDeviceType(userAgent) {
 if (/(iPhone|iPad|iPod|iOS)/i.test(userAgent) || (userAgent.match(/(macintosh)/) && navigator.maxTouchPoints > 1)) {
 return 'iOS';
 }
 else if (/android/i.test(userAgent)) {
 return 'Android';
 }
 else {
 return 'PC';
 }
}
/* 匹配浏览器 */
function detectBrowser(userAgent) {
 if (/safari/i.test(userAgent) && !/(chrome|crios|crmo|edg|edge)/i.test(userAgent)) {
 return 'Safari';
 } else if (/(chrome|crios|crmo)/i.test(userAgent) && !/(edg|edge)/i.test(userAgent)) {
 return 'Chrome';
 } else if (/(edg|edge|edgios|edga|edg)/i.test(userAgent)) {
 return 'Edge';
 } else if (/(firefox|fxios)/i.test(userAgent)) {
 return 'Firefox';
 } else if (/xiaomi/i.test(userAgent)) {
 return 'Xiaomi';
 } else if (/huawei/i.test(userAgent)) {
 return 'Huawei';
 } else if (/samsung/i.test(userAgent)) {
 return 'Samsung';
 } else {
 return 'Other';
 }
}
/*系统_浏览器*/
function joinSource() {
 const userAgent = navigator.userAgent.toLowerCase();
 var sys = detectDeviceType(userAgent);
 if (sys == "PC") {
 return "PC_Browser";
 } else if (sys == "Android") {
 return sys + "_" + detectBrowser(userAgent);
 } else if (sys == "iOS") {
 return sys + "_" + detectBrowser(userAgent);
 }
}

 

作者:无昵称老炮儿原文地址:https://www.cnblogs.com/LaoPaoEr/p/18362457

%s 个评论

要回复文章请先登录注册