ブラウザ嗅ぎ


ブラウザの嗅覚は主にWindowオブジェクトのNavigator属性に基づいてブラウザのタイプ、名称、メーカーおよび実行環境などを判断し、異なる生産環境の需要を満たす.
よく見られる の判断:


    
        
    
    
        
            var ua = navigator.userAgent.toLowerCase();
            var isWeixin = ua.indexOf('micromessenger') != -1;
            var isAndroid = ua.indexOf('android') != -1;
            var isIos = (ua.indexOf('iphone') != -1) || (ua.indexOf('ipad') != -1);
            if (!isWeixin) {
                document.head.innerHTML = '<title>  ,   </title><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0"><link rel="stylesheet" type="text/css" href="https://res.wx.qq.com/open/libs/weui/0.4.1/weui.css">';
                document.body.innerHTML = '<div class="weui_msg"><div class="weui_icon_area"><i class="weui_icon_info weui_icon_msg"></i></div><div class="weui_text_area"><h4 class="weui_msg_title">           </h4></div></div>';
            }
        
    

以上のコードjs部分は、基本的に、微信ブラウザとしての実行環境での判断を直接切り取り、エラーページの内容を提供することができる.
特筆すべきは、私は微信windowsバージョンで内蔵ブラウザの識別結果がChromeであり、微信環境MicroMessageerではないことをテストした.
Navigatorオブジェクト
ブラウザコマンドラインの下で、window.navigatorを使用して、ブラウザコマンドラインに含まれるさまざまなプロパティの内容を直接表示できます(共通のプロパティの説明を参照).
  • appNameはブラウザの名前を返します.IEのうち、“Microsoft Internet Explorer”です.FireFox のうち、“Netscape”です.
  • appVersionは、ブラウザのプラットフォームおよびバージョン情報(通常は数値で開始)を返します.
  • platformは、ブラウザを実行するオペレーティングシステムプラットフォームを返します.
  • onLineは、システムがオフラインモードであるかどうかを示すブール値を返します.
  • userAgent!!!クライアント送信サーバのuser-agentヘッダの値を返します.

  • userAgentプロパティは、ブラウザがHTTPリクエストに使用するユーザーエージェントヘッダの値を宣言する読み取り専用文字列です.
    一般に、navigator.appCodeNameの値の後に navigator.appVersionの値を加えて構成される.例えば、Mozilla/4.0(compatible;MSIE 6.0;Windows NT 5.2;SV 1;.NET CLR 1.1.4322).
    注意:ユーザーエージェントヘッダ:user-agent header.
    まとめられたブラウザ嗅覚プラグイン
        ;
        var _BROWSER = (function() {
            function detect() {
                // start browser detect
                var nVer = navigator.appVersion,
                    nAgt = navigator.userAgent,
                    browser = navigator.appName,
                    version = '' + parseFloat(navigator.appVersion),
                    majorVersion, nameOffset, verOffset, ix, network = 'unknown';
                // Opera
                if ((verOffset = nAgt.indexOf('Opera')) != -1) {
                    browser = 'Opera';
                    version = nAgt.substring(verOffset + 6);
                    if ((verOffset = nAgt.indexOf('Version')) != -1) {
                        version = nAgt.substring(verOffset + 8);
                    }
                }
                // Opera Next
                if ((verOffset = nAgt.indexOf('OPR')) != -1) {
                    browser = 'Opera';
                    version = nAgt.substring(verOffset + 4);
                }
                // MSIE
                if ((verOffset = nAgt.indexOf('MSIE')) != -1) {
                    browser = 'Microsoft Internet Explorer';
                    version = nAgt.substring(verOffset + 5);
                }
                // Chrome
                if ((verOffset = nAgt.indexOf('Chrome')) != -1) {
                    browser = 'Chrome';
                    version = nAgt.substring(verOffset + 7);
                }
                // Safari
                if ((verOffset = nAgt.indexOf('Safari')) != -1) {
                    browser = 'Safari';
                    version = nAgt.substring(verOffset + 7);
                    if ((verOffset = nAgt.indexOf('Version')) != -1) {
                        version = nAgt.substring(verOffset + 8);
                    }
                }
                // Firefox
                if ((verOffset = nAgt.indexOf('Firefox')) != -1) {
                    browser = 'Firefox';
                    version = nAgt.substring(verOffset + 8);
                }
                // MSIE 11+
                if (nAgt.indexOf('Trident/') != -1) {
                    browser = 'Microsoft Internet Explorer 11+';
                    version = nAgt.substring(nAgt.indexOf('rv:') + 3);
                }
                // WeiXin
                if (nAgt.toLowerCase().indexOf('micromessenger') != -1) {
                    browser = 'WeiXin';
                    if (nAgt.indexOf('NetType/WIFI') != -1) {
                        network = 'WIFI';
                    } else if (nAgt.indexOf('NetType/2G') != -1) {
                        network = '2G';
                    } else if (nAgt.indexOf('NetType/3G+') != -1) {
                        network = '3G+';
                    } else if (nAgt.indexOf('NetType/4G') != -1) {
                        network = '4G';
                    }
                    verOffset = nAgt.lastIndexOf('/')
                    version = nAgt.substring(verOffset + 1);
                    // if (browser.toLowerCase() == browser.toUpperCase()) {
                    //     browser = navigator.appName;
                    // }
                }
                // Other browsers
                else if ((nameOffset = nAgt.lastIndexOf(' ') + 1) < (verOffset = nAgt.lastIndexOf('/'))) {
                    browser = nAgt.substring(nameOffset, verOffset);
                    version = nAgt.substring(verOffset + 1);
                    if (browser.toLowerCase() == browser.toUpperCase()) {
                        browser = navigator.appName;
                    }
                }
        
                // trim the version string
                if ((ix = version.indexOf(';')) != -1) version = version.substring(0, ix);
                if ((ix = version.indexOf(' ')) != -1) version = version.substring(0, ix);
                if ((ix = version.indexOf(')')) != -1) version = version.substring(0, ix);
                majorVersion = parseInt('' + version, 10);
                if (isNaN(majorVersion)) {
                    version = '' + parseFloat(navigator.appVersion);
                    majorVersion = parseInt(navigator.appVersion, 10);
                }
                // mobile version
                var mobile = /Mobile|mini|Fennec|Android|iP(ad|od|hone)/.test(nVer);
        
                // start system detect
                var os = '';
                var clientStrings = [{
                    s: 'Windows 10',
                    r: /(Windows 10.0|Windows NT 10.0)/
                }, {
                    s: 'Windows 8.1',
                    r: /(Windows 8.1|Windows NT 6.3)/
                }, {
                    s: 'Windows 8',
                    r: /(Windows 8|Windows NT 6.2)/
                }, {
                    s: 'Windows 7',
                    r: /(Windows 7|Windows NT 6.1)/
                }, {
                    s: 'Windows Vista',
                    r: /Windows NT 6.0/
                }, {
                    s: 'Windows Server 2003',
                    r: /Windows NT 5.2/
                }, {
                    s: 'Windows XP',
                    r: /(Windows NT 5.1|Windows XP)/
                }, {
                    s: 'Windows 2000',
                    r: /(Windows NT 5.0|Windows 2000)/
                }, {
                    s: 'Windows ME',
                    r: /(Win 9x 4.90|Windows ME)/
                }, {
                    s: 'Windows 98',
                    r: /(Windows 98|Win98)/
                }, {
                    s: 'Windows 95',
                    r: /(Windows 95|Win95|Windows_95)/
                }, {
                    s: 'Windows NT 4.0',
                    r: /(Windows NT 4.0|WinNT4.0|WinNT|Windows NT)/
                }, {
                    s: 'Windows CE',
                    r: /Windows CE/
                }, {
                    s: 'Windows 3.11',
                    r: /Win16/
                }, {
                    s: 'Android',
                    r: /Android/
                }, {
                    s: 'Open BSD',
                    r: /OpenBSD/
                }, {
                    s: 'Sun OS',
                    r: /SunOS/
                }, {
                    s: 'Linux',
                    r: /(Linux|X11)/
                }, {
                    s: 'iOS',
                    r: /(iPhone|iPad|iPod)/
                }, {
                    s: 'Mac OS X',
                    r: /Mac OS X/
                }, {
                    s: 'Mac OS',
                    r: /(MacPPC|MacIntel|Mac_PowerPC|Macintosh)/
                }, {
                    s: 'QNX',
                    r: /QNX/
                }, {
                    s: 'UNIX',
                    r: /UNIX/
                }, {
                    s: 'BeOS',
                    r: /BeOS/
                }, {
                    s: 'OS/2',
                    r: /OS\/2/
                }, {
                    s: 'Search Bot',
                    r: /(nuhk|Googlebot|Yammybot|Openbot|Slurp|MSNBot|Ask Jeeves\/Teoma|ia_archiver)/
                }];
                for (var id in clientStrings) {
                    var cs = clientStrings[id];
                    if (cs.r.test(nAgt)) {
                        os = cs.s;
                        break;
                    }
                }
                var osVersion = '';
                if (/Windows/.test(os)) {
                    osVersion = /Windows (.*)/.exec(os)[1];
                    os = 'Windows';
                }
                switch (os) {
                    case 'Mac OS X':
                        osVersion = /Mac OS X (10[\.\_\d]+)/.exec(nAgt)[1];
                        break;
                    case 'Android':
                        osVersion = /Android ([\.\_\d]+)/.exec(nAgt)[1];
                        break;
                    case 'iOS':
                        osVersion = /OS (\d+)_(\d+)_?(\d+)?/.exec(nVer);
                        osVersion = osVersion[1] + '.' + osVersion[2] + '.' + (osVersion[3] | 0);
                        break;
                }
                //detect data
                var params = {};
                params.os = os; //    
                params.osVersion = osVersion ? osVersion : 'unknown'; //      
                params.mobile = mobile; //       
                params.browser = browser; //   
                params.browserVersion = version; //     
                params.browserMajorVersion = majorVersion; //   major  
        
                //    
                return params;
        
            }
            return {
                detect: detect
            }
        })();
        

    参考になるhttps://segmentfault.com/q/10...しかし、そのコードには深刻な脆弱性があり、特に微信環境でネットワークタイプを条件にしているかどうかを検出して、私を殺しました.ここではプラグインとしてカプセル化します.
    呼び出し方法
    BROSWER.detect()

    結果の例を返します
    {
        "os":"Windows",
        "osVersion":"7",
        "mobile":false,
        "browser":"Chrome",
        "browserVersion":"59.0.3071.115",
        "browserMajorVersion":59
    }