1. 程式人生 > >[樂意黎原創] JS根據useAgent來判斷edge, ie, firefox, chrome, opera, safari 等瀏覽器的型別及版本

[樂意黎原創] JS根據useAgent來判斷edge, ie, firefox, chrome, opera, safari 等瀏覽器的型別及版本

JS根據瀏覽器的useAgent來判斷瀏覽器的型別。

userAgent 屬性是一個只讀的字串,聲明瞭瀏覽器用於 HTTP 請求的使用者代理頭的值。

javascript語法:navigator.userAgent

PHP語法:$_SERVER['HTTP_USER_AGENT']

ASP語法:Request.ServerVariables("HTTP_USER_AGENT")

ASP.NET語法:HttpContext.Current.Request.UserAgent

JSP語法:request.getHeader("User-Agent")

-------------------------------------------------------
Chrome: (version: 50.0.2661.102 m)

  jsp:   userAgent :Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko)Chrome/50.0.2661.102 Safari/537.36

  js:   userAgent :  Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.102 Safari/537.36

-------------------------------------------------------

Firefox: (version: 47.0)

  jsp: userAgent : Mozilla/5.0 (Windows NT 6.1; WOW64; rv:47.0) Gecko/20100101Firefox/47.0

  js:   userAgent : Mozilla/5.0 (Windows NT 6.1; WOW64; rv:47.0) Gecko/20100101Firefox/47.0

-------------------------------------------------------

Safari: (version: 5.1.7)

  jsp: userAgent : Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/534.57.2 (KHTML, like Gecko)

Version/5.1.7Safari/534.57.2

  js:   userAgent : Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/534.57.2 (KHTML, like Gecko) Version/5.1.7Safari/534.57.2

-------------------------------------------------------

IE 8:  (version: 8.0.7601.17514, update versions: 0)

  jsp:  userAgent : Mozilla/4.0 (compatible;MSIE 8.0; Windows NT 6.1; WOW64; Trident/4.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0)

  js:   userAgent : Mozilla/4.0 (compatible;MSIE 8.0; Windows NT 6.1; WOW64; Trident/4.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0)

-------------------------------------------------------

IE 11:  (version: 11.0.9600.18321 update Versions: 11.0.31)

  jsp: userAgent : Mozilla/5.0 (Windows NT 6.3; WOW64;Trident/7.0; rv:11.0) like Gecko

  js:   userAgent : Mozilla/5.0 (Windows NT 6.3; WOW64;Trident/7.0; .NET4.0E; .NET4.0C; .NET CLR 3.5.30729; .NET CLR 2.0.50727; .NET CLR 3.0.30729; InfoPath.3; rv:11.0) like Gecko

-------------------------------------------------------

Windows Edge:  (version: 25.10580.0.0)

  jsp: userAgent : Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2486.0 Safari/537.36 Edge/13.10586

  js:   userAgent : Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/46.0.2486.0 Safari/537.36 Edge/13.10586

-------------------------------------------------------


[樂意黎 ]

接下來,如何判斷瀏覽器的型別呢 ?

IE 瀏覽器 :

TokenDescription
EdgeWindows Edge
Trident/7.0IE11
Trident/6.0Internet Explorer 10
Trident/5.0Internet Explorer 9
Trident/4.0Internet Explorer 8

JS 程式碼: 
//返回瀏覽器的型別: "ie", "firefox", "chrome", "opera", "safari", "unknow"

// author: aerchi
// site:www.aerchi.com
// blog: http://blog.csdn.net/aerchi/article/details/51697592
// email: [email protected]
// date: 2016-06-17
// update: 2016-08-11 00:56:00

// call like: getBrowser(1)
// return like "chrome/50.0.2661.102"
// call like: getBrowser()
// return like "chrome"
function getBrowser(getVersion)
{
    //注意關鍵字大小寫
    var ua_str = navigator.userAgent.toLowerCase(), ie_Tridents, trident, match_str, ie_aer_rv, browser_chi_Type;

    console.log("article url: http://blog.csdn.net/aerchi/article/details/51697592");

    //判斷IE 瀏覽器, 
    //blog: http://blog.csdn.net/aerchi/article/details/51697592
    if("ActiveXObject" in self){
        // ie_aer_rv:  指示IE 的版本.
        // It can be affected by the current document mode of IE.
        ie_aer_rv= (match_str = ua_str.match(/msie ([\d.]+)/)) ?match_str[1] :
              (match_str = ua_str.match(/rv:([\d.]+)/)) ?match_str[1] : 0;

        // ie: Indicate the really version of current IE browser.
        ie_Tridents = {"trident/7.0": 11, "trident/6.0": 10, "trident/5.0": 9, "trident/4.0": 8};
        //匹配 ie8, ie11, edge
        trident = (match_str = ua_str.match(/(trident\/[\d.]+|edge\/[\d.]+)/)) ?match_str[1] : undefined;
        browser_chi_Type = (ie_Tridents[trident] || ie_aer_rv) > 0 ? "ie" : undefined;
    }else{
        //判斷 windows edge 瀏覽器
        // match_str[1]: 返回瀏覽器及版本號,如: "edge/13.10586"
        // match_str[1]: 返回版本號,如: "edge" 

        //若要返回 "edge" 請把下行的 "ie" 換成 "edge"。 注意引號及冒號是英文狀態下輸入的
        browser_chi_Type = (match_str = ua_str.match(/edge\/([\d.]+)/)) ? "ie" :
                    //判斷firefox 瀏覽器
                      (match_str = ua_str.match(/firefox\/([\d.]+)/)) ? "firefox" : 
                    //判斷chrome 瀏覽器
                      (match_str = ua_str.match(/chrome\/([\d.]+)/)) ? "chrome" : 
                    //判斷opera 瀏覽器
                      (match_str = ua_str.match(/opera.([\d.]+)/)) ? "opera" : 
                    //判斷safari 瀏覽器
                      (match_str = ua_str.match(/version\/([\d.]+).*safari/)) ? "safari" : undefined;
    }


    console.log("author: aerchi, blog: http://blog.csdn.net/aerchi");    

    //返回瀏覽器型別和版本號
    var verNum, verStr;
    verNum = trident && ie_Tridents[trident] ? ie_Tridents[trident] : match_str[1];

    verStr = (getVersion != undefined) ? browser_chi_Type+"/"+verNum : browser_chi_Type;
    return verStr;
 }

-----------

相關推薦

no