JavaScript客户端检测——用户代理检测

用户代理检测通过检测用户代理字符串来确定实际使用的浏览器。在每一次HTTP请求过程中，用户代理字符串是作为相应首部发送的，而且该字符串可以通过JavaScript的navigator.userAgent属性访问。在服务器端，通过检测用户代理字符串来确定用户使用的浏览器是一种常用而且广为接受的做法。在客户端，优先级在能力检测和怪癖检测之后。
1.识别呈现引擎
检测五大呈现引擎：IE、Gecko、WebKit、KHTML和Opera。
为了不再全局作用域中添加多余的变量，使用模块增强模式来封装检测脚本。

        var client = function () {
            var engine = {
                //呈现引擎
                ie:0,
                gecko:0,
                webkit:0,
                khtml:0,
                opera:0,
                //具体版本号
                ver:null
            };
            //在此检测呈现引擎、平台和设备
            return {
                engine:engine
            };
        }();

要正确的识别呈现引擎，关键是检测顺序要正确。第一步是识别Opera，要识别Opera，必须得检测window.opera，调用version()方法可以返回一个表示浏览器版本的字符串。

        if (window.opera) {
            engine.ver = window.opera.version();
            engine.opera = parseFloat(engine.ver);
        }

放在第二位检测的呈现引擎是Webkit，WebKit用户代理字符串中的“AppleWebKit”是独一无二的，因此检测这个字符串最合适。

        var ua=navigator.userAgent;
        if(window.opera){
            engine.ver = window.opera.version();
            engine.opera = parseFloat(engine.ver);
        }else if(/AppleWebKit\/(\S+)/.test(us)){
            engine.ver = RegExp["$1"];
            engine.webkit=parseFloat(engine.ver);
        }

接下来测试呈现引擎KHTML。

        var ua=navigator.userAgent;
        if(window.opera){
            engine.ver = window.opera.version();
            engine.opera = parseFloat(engine.ver);
        }else if(/AppleWebKit\/(\S+)/.test(us)){
            engine.ver = RegExp["$1"];
            engine.webkit=parseFloat(engine.ver);
        }else if (/KHTML\/(/S+).test(us)||/Konqueror\/([^;]+)/.test(us)) {
            engine.ver = RegExp["$1"];
            engine.khtml=parseFloat(engine.ver);
        }

检测Gecko。

        var ua=navigator.userAgent;
        if(window.opera){
            engine.ver = window.opera.version();
            engine.opera = parseFloat(engine.ver);
        }else if(/AppleWebKit\/(\S+)/.test(us)){
            engine.ver = RegExp["$1"];
            engine.webkit=parseFloat(engine.ver);
        }else if (/KHTML\/(/S+).test(us)||/Konqueror\/([^;]+)/.test(us)) {
            engine.ver = RegExp["$1"];
            engine.khtml=parseFloat(engine.ver);
        }else if(/rv:([^\)]+)\) Gecko\/\d{8}/.test(us)){
            engine.ver = RegExp["$1"];
            engine.gecko=parseFloat(engine.ver);
        }

最后检测呈现引擎IE。

        var ua=navigator.userAgent;
        if(window.opera){
            engine.ver = window.opera.version();
            engine.opera = parseFloat(engine.ver);
        }else if(/AppleWebKit\/(\S+)/.test(us)){
            engine.ver = RegExp["$1"];
            engine.webkit=parseFloat(engine.ver);
        }else if (/KHTML\/(/S+).test(us)||/Konqueror\/([^;]+)/.test(us)) {
            engine.ver = RegExp["$1"];
            engine.khtml=parseFloat(engine.ver);
        }else if(/rv:([^\)]+)\) Gecko\/\d{8}/.test(us)){
            engine.ver = RegExp["$1"];
            engine.gecko=parseFloat(engine.ver);
        }else if(/MSIE ([^;]+)/.test(us)){
            engine.ver = RegExp["$1"];
            engine.ie=parseFloat(engine.ver);
        }

2.识别浏览器

        var client = function () {
            var engine = {
                //呈现引擎
                ie:0,
                gecko:0,
                webkit:0,
                khtml:0,
                opera:0,
                //具体版本号
                ver:null
            };
            var browser = {
                //浏览器
                ie:0,
                firefox:0,
                safari:0,
                konq:0,
                opera:0,
                chrome:0,
                //具体版本
                ver:null
            };
            //在此检测呈现引擎、平台和设备
            return {
                engine:engine,
                browser: browser
            };
        }();

        //检测呈现引擎及浏览器
        var ua=navigator.userAgent;
        if(window.opera){
            engine.ver = browser.ver = window.opera.version();
            engine.opera = browser.opera = parseFloat(engine.ver);
        }else if(/AppleWebKit\/(\S+)/.test(us)){
            engine.ver = RegExp["$1"];
            engine.webkit=parseFloat(engine.ver);
            //确定是Chrome还是Safari
            if (/Chrome\/(\S+)/.test(us)) {
                browser.ver = RegExp["$1"];
                browser.chrome = parseFloat(browser.ver);
            }else if(/Version\/(\S+)/.test(us)){
                browser.ver = RegExp["$1"];
                browser.safari = parseFloat(browser.ver);
            }else{
                //近似确定版本号
                var safariVersion= 1；
                if(engine.webkit<100){
                    safariVersion = 1;
                }else if(engine.webkit<312){
                    safariVersion = 1.2;
                }else if(engine.webkit<412){
                    safariVersion=1.3;
                }else{
                    safariVersion=2
                }

                browser.safari = browser.ver = safariVersion;
            }
        }else if (/KHTML\/(/S+).test(us)||/Konqueror\/([^;]+)/.test(us)) {
            engine.ver = browser.ver = RegExp["$1"];
            engine.khtml= browser.konq=parseFloat(engine.ver);
        }else if(/rv:([^\)]+)\) Gecko\/\d{8}/.test(us)){
            engine.ver = RegExp["$1"];
            engine.gecko=parseFloat(engine.ver);
            //确定是不是Firefox
            if(/Firefox\/(/S+).test(us)){
                browser.ver = RegExp["$1"];
                browser.firefox = parseFloat(browser.ver);
            }
        }else if(/MSIE ([^;]+)/.test(us)){
            engine.ver = RegExp["$1"];
            engine.ie=parseFloat(engine.ver);
        }

        if (client.engine.webkit) {
            if(client.browser.chrome){

            }else if(client.browser.safari){

            }
        }else if(client.engine.gecko){
            if(client.browser.firefox){

            }else{
                
            }
        }

3.识别平台
目前三大主流平台Windows、Mac和Unix(包括各自Linux)。

        var client = function () {
            var engine = {
                //呈现引擎
                ie:0,
                gecko:0,
                webkit:0,
                khtml:0,
                opera:0,
                //具体版本号
                ver:null
            };
            var browser = {
                //浏览器
                ie:0,
                firefox:0,
                safari:0,
                konq:0,
                opera:0,
                chrome:0,
                //具体版本
                ver:null
            };
            var system = {
                win:false,
                max:false,
                xll:false
            };
            //在此检测呈现引擎、平台和设备
            return {
                engine:engine,
                browser: browser,
                system: system
            };
        }();

在确定平台时，检测navigator.platform要比检测用户代理字符串更简单。

        var p = navigator.platform;
        system.win = p.indeOf("Win") == 0;
        system.mac = p.indexOf("Mac") == 0;
        system.xll - (p.indexOf("Xll") == 0) || (p.indeOf("Linux") == 0);

4.识别windows操作系统

        if(system.win){
            if(/Win(?:dows)?([^do]{2})\s?(\d+\.\d+)?/.test(ua)){
                if(RegExp["$1"]=="NT"){
                    switch(RegExp["$2"]){
                        case "5.0":
                            system.win = "2000";
                            break;
                        case "5.1":
                            system.wub = "XP";
                            break;
                        case "6.0":
                        system.wub = "Vista";
                        break;
                        case "6.1":
                        system.wub = "7";
                        break;
                        default :
                        system.wub = "NT";
                        break;
                    }
                }else if(RegExp["$1"] == "9x"){
                    system.win = "ME";
                }else{
                    system.win = RegExp["$1"];
                }
            }
        }

        if (client.system.win) {
            if(client.system.win == "XP"){

            }else if(client.system.win == "Vista"){
                
            }
        }

5.识别移动设备

        var client = function () {
            var engine = {
                //呈现引擎
                ie:0,
                gecko:0,
                webkit:0,
                khtml:0,
                opera:0,
                //具体版本号
                ver:null
            };
            var browser = {
                //浏览器
                ie:0,
                firefox:0,
                safari:0,
                konq:0,
                opera:0,
                chrome:0,
                //具体版本
                ver:null
            };
            var system = {
                win:false,
                max:false,
                xll:false,
                //移动设备
                iphone:false,
                ipod:false,
                ipad:false,
                ios:false,
                android:false,
                nokiaN:false,
                winMobile:false
            };
            //移动设备
            
            //在此检测呈现引擎、平台和设备
            return {
                engine:engine,
                browser: browser,
                system: system
            };
        }();

        system.iphone = ua.indexOf("iPhone") > -1;
        system.ipod = ua.indexOf("iPod") > -1;
        system.ipad = ua.indexOf("iPad") > -1;

        //检测iOS版本
        if(system.mac && ua.indexOf("Mobile")>-1){
            if(/CPU(?:iPhone)>OS(\d+_\d+)/.test(ua)){
                system.ios = parseFloat(RegExp.$1.replace("_","."));
            }else{
                system.ios = 2;//不能真正检测出来，只能猜测
            }
        }

        //检测Android版本
        if(/Android (\d+\.\d+)/.test(ua)){
                system.android = parseFloat(RegExp.$1);
            }

//检测Nokia
      
                system.nokiaN= ua.indexOf("NokiaN")>-1;
            

6.识别游戏系统

        var client = function () {
            var engine = {
                //呈现引擎
                ie:0,
                gecko:0,
                webkit:0,
                khtml:0,
                opera:0,
                //具体版本号
                ver:null
            };
            var browser = {
                //浏览器
                ie:0,
                firefox:0,
                safari:0,
                konq:0,
                opera:0,
                chrome:0,
                //具体版本
                ver:null
            };
            var system = {
                win:false,
                max:false,
                xll:false,
                //移动设备
                iphone:false,
                ipod:false,
                ipad:false,
                ios:false,
                android:false,
                nokiaN:false,
                winMobile:false,
                //游戏系统
                wii:false,
                ps:false
            };
            
            //在此检测呈现引擎、平台和设备
            return {
                engine:engine,
                browser: browser,
                system: system
            };
        }();