js如何判断用户使用的设备类型及平台

部分原文链接：https://www.cnblogs.com/coober/p/6594379.html

前端开发者手册：https://dwqs.gitbooks.io/frontenddevhandbook/content/

本文章为部分转载文章。

前端开发经常遇到需要判断用户的浏览设备，是pc端还是移动端，移动端使用的是什么手机系统？android、ios、ipad、windows phone等等，有时候还需要知道用户浏览页面是在微信中打开还是在移动端浏览器中打开，等等一系列判断做一些相应的处理。

1、首先判断pc端还是移动端。

 1     function IsPC() {
 2         var userAgentInfo = navigator.userAgent;
 3         var Agents = ["Android", "iPhone",
 4                     "SymbianOS", "Windows Phone",
 5                     "iPad", "iPod"];
 6         var flag = true;
 7         for (var v = 0; v < Agents.length; v++) {
 8             if (userAgentInfo.indexOf(Agents[v]) > 0) {
 9                 flag = false;
10                 break;
11             }
12         }
13         return flag;
14     }

2、判断用户移动端使用的系统平台

1     var u = navigator.userAgent;
2     if (u.indexOf('Android') > -1 || u.indexOf('Linux') > -1) {
3         //安卓手机
4     } else if (u.indexOf('iPhone') > -1) {
5         //苹果手机
6     } else if (u.indexOf('Windows Phone') > -1) {
7         //winphone手机
8     }

3、判断用户是否在微信中打开

1    function isWeiXin(){ 
2         var ua = navigator.userAgent.toLowerCase(); 
3         if(ua.indexOf('micromessenger') != -1) { 
4             return true; 
5         } else { 
6             return false; 
7         } 
8     }

4、判断安卓手机品牌

function judgeBrand() {
    var sUserAgent =navigator.userAgent.toLowerCase();
    
    var isIphone = sUserAgent.match(/iphone/i) == "iphone";
    var isHuawei = sUserAgent.match(/huawei/i) == "huawei";
    var isHonor = sUserAgent.match(/honor/i) == "honor";
    var isOppo = sUserAgent.match(/oppo/i) == "oppo";
    var isOppoR15 = sUserAgent.match(/pacm00/i) == "pacm00";
    var isVivo = sUserAgent.match(/vivo/i) == "vivo";
    var isXiaomi = sUserAgent.match(/mi\s/i) == "mi ";
    var isXiaomi2s = sUserAgent.match(/mix\s/i) == "mix ";
    var isRedmi = sUserAgent.match(/redmi/i) == "redmi";
    var isSamsung = sUserAgent.match(/sm-/i) == "sm-";

    if (isIphone) {
        return 'iphone';
    } else if (isHuawei || isHonor) {
        return 'huawei';
    } else if (isOppo || isOppoR15) {
        return 'oppo';
    } else if (isVivo) {
        return 'vivo';
    } else if (isXiaomi || isRedmi || isXiaomi2s) {
        return 'xiaomi';
    } else if (isSamsung) {
        return 'samsung';
    } else {
        return 'default';
    }
}

5、判断浏览器类型

function myBrowser() {
    var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
    var isOpera = userAgent.indexOf("Opera") > -1; //判断是否Opera浏览器
    var isIE = userAgent.indexOf("compatible") > -1
        && userAgent.indexOf("MSIE") > -1 && !isOpera; //判断是否IE浏览器
    var isEdge = userAgent.indexOf("Edge") > -1; //判断是否IE的Edge浏览器
    var isFF = userAgent.indexOf("Firefox") > -1; //判断是否Firefox浏览器
    var isSafari = userAgent.indexOf("Safari") > -1; //判断是否Safari浏览器
    var isChrome = userAgent.indexOf("Chrome") > -1; //判断Chrome浏览器

    if (isIE) {
        var reIE = new RegExp("MSIE (\\d+\\.\\d+);");
        reIE.test(userAgent);
        var fIEVersion = parseFloat(RegExp["$1"]);
        if (fIEVersion == 7) {
            return "IE7";
        } else if (fIEVersion == 8) {
            return "IE8";
        } else if (fIEVersion == 9) {
            return "IE9";
        } else if (fIEVersion == 10) {
            return "IE10";
        } else if (fIEVersion == 11) {
            return "IE11";
        } else {
            return "0";
        }//IE版本过低
        return "IE";
    }
    if (isOpera) {
        return "Opera";
    }
    if (isEdge) {
        return "Edge";
    }
    if (isFF) {
        return "FF";
    }
    if (isSafari) {
        return "Safari";
    }
    if (isChrome) {
        return "Chrome";
    }
}