JavaScript判斷瀏覽器類型以及系統(tǒng)

現如今的瀏覽器眾多,版本繁雜, 為了適應版本需要確定瀏覽器的類型,
尤其是360瀏覽器又分為安全瀏覽器和急速瀏覽器,特此封裝一個可用的方法庫,可在github上查看
GitHub

其中ie和chrome可查看version,并能區(qū)分360安全瀏覽器和急速瀏覽器

/**
 * 瀏覽器內核判斷
 */
function getUserAgentInfoFoo() {
    var ua = {};
    var win = window;
    var nav = win.navigator;
    var doc = win.document;
    var ieAX = win.ActiveXObject;
    var ieMode = doc.documentMode;
    var REG_APPLE = /^Apple/;
    var ieVer = _getIeVersion() || ieMode || 0;
    var isIe = ieAX || ieMode;
    var regEdge = /Edge/i;
    var regChromeVersion = /(?:Chrome\/)(\d+)(?:\.)/i;
    var chromiumType = _getChromiumType();

    /**
     * 檢測 external 是否包含該字段
     * @param reg 正則
     * @param type 檢測類型,0為鍵,1為值
     * @returns {boolean}
     * @private
     */
    function _testExternal(reg, type) {
        var external = win.external || {};

        for (var i in external) {
            if (reg.test(type ? external[i] : i)) {
                return true;
            }
        }

        return false;
    }

    /**
     * 獲取 Chromium 內核瀏覽器類型
     * @link http://www.adtchrome.com/js/help.js
     * @link https://ext.chrome.#/webstore
     * @link https://ext.se.#
     * @return {String}
     *         360ee 360極速瀏覽器
     *         360se 360安全瀏覽器
     *         sougou 搜狗瀏覽器
     *         liebao 獵豹瀏覽器
     *         chrome 谷歌瀏覽器
     *         ''    無法判斷
     * @version 1.0
     * 2014年3月12日20:39:55
     */
    function _getChromiumType() {
        if (isIe || typeof win.scrollMaxX !== 'undefined' || REG_APPLE.test(nav.vendor || '')) {
            return '';
        }
        if (regEdge.test(navigator.userAgent)) {
            return 'Edge';
        }

        var _track = 'track' in document.createElement('track');//chrome下為true,ie下為false
        var webstoreKeysLength = win.chrome && win.chrome.webstore ? Object.keys(win.chrome.webstore).length : 0;
        var chromeAppKeysLength = win.chrome && win.chrome.app ? Object.keys(win.chrome.app).length : 0;//360se=6 360ee=5
        // 搜狗瀏覽器
        if (_testExternal(/^sogou/i, 0)) {
            return 'sogou';
        }

        // 獵豹瀏覽器
        if (_testExternal(/^liebao/i, 0)) {
            return 'liebao';
        }

        // chrome
        if (win.clientInformation && win.clientInformation.languages && win.clientInformation.languages.length > 2) {
            return 'chrome';
        }

        //注意此方法只能判斷急速模式下的瀏覽器類型
        if (_track) {
            // 360極速瀏覽器|360安全瀏覽器
            // return webstoreKeysLength > 1 ? '360ee' : '360se';//截止20170405已經失效 此方法不能判斷安全與急速
            // return chromeAppKeysLength > 5 ? '360ee' : '360se';//通過app下的keys個數判斷
            return Object.keys(window.chrome.app).join().indexOf("getDetailsForFrame") > -1 ? '360ee' : '360se';//通過360se下有'getDetailsForFrame'特殊方法判斷
        }

        return '';
    }

    // 獲得ie瀏覽器版本
    function _getIeVersion() {
        var v = 3,
            p = document.createElement('p'),
            all = p.getElementsByTagName('i');

        while (
            p.innerHTML = '<!--[if gt IE ' + (++v) + ']><i></i><![endif]-->',
                all[0]);

        return v > 4 ? v : 0;
    }

    //獲得chrome瀏覽器版本
    function _getChromeVersion() {
        var ua = navigator.userAgent;
        var v = regChromeVersion.exec(ua);
        return v[v.length - 1];
    }

    return {
        isIE: function () {
            return !!ieVer;
        },
        ieVersion: function () {
            return ieVer;
        },
        isEdge: function () {
            return chromiumType === 'Edge';
        },
        isChrome: function () {
            return chromiumType === 'chrome';
        },
        chromeVersion: function () {
            return _getChromeVersion();
        },
        is360se: function () {
            return chromiumType === '360se';
        },
        is360ee: function () {
            return chromiumType === '360ee';
        },
        isLiebao: function () {
            return chromiumType === 'liebao';
        },
        isSogou: function () {
            return chromiumType === 'sogou';
        },
        isQQ: function () {
            return chromiumType === 'qq';
        }
    }
}
function getUserAgentInfoToString() {
    var shell = getUserAgentInfoFoo();
    if (shell.isIE()) {
        return "IE:" + shell.ieVersion();
    }
    if (shell.isEdge()) {
        return 'Edge'
    }
    if (shell.isChrome()) {
        return 'chrome:' + shell.chromeVersion();
    }
    if (shell.is360se()) {
        return '360se'
    }
    if (shell.is360ee()) {
        return '360ee'
    }
    if (shell.isLiebao()) {
        return 'liebao'
    }
    if (shell.isSogou()) {
        return 'sogou'
    }
    if (shell.isQQ()) {
        return 'qq'
    }
    return ''
}

根據瀏覽器判斷當前系統(tǒng)

 //判斷系統(tǒng)
 let u = navigator.userAgent;
 let isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //g
 let isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios終端
 if (isAndroid) {
 this.system = 'Android';
 } else if (isIOS) {
 this.system = 'IOS';
 } else {
 this.system = 'pc';
 }

另外在瀏覽器頭部添加<meta>信息,可使360默認以急速模式打開.

    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><!--指定ie用chrome內核渲染 需要安裝GCF插件-->
    <meta name="renderer" content="webkit"><!--360瀏覽器默認webkit模式-->

參考:https://github.com/cloudcome/alien/blob/master/src/core/navigator/shell.js

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發(fā)布,文章內容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內容

  • 太長了,還是轉載吧...今天在看博客的時候,無意中發(fā)現了@Trinea在GitHub上的一個項目Android開源...
    龐哈哈哈12138閱讀 20,383評論 3 283
  • 最近《白夜追兇》火了,非常火! 在對國產劇向來嚴苛的豆瓣上面,依然是9.1的高分。 而比劇更火的,是劇里的潘粵明。...
    小藝醬閱讀 883評論 0 1
  • 減少的是沙子, 增多的是皺紋。 存在與虛無妥協(xié), 鐘表統(tǒng)治著一切。 被鐘表綁架, 搭上的是一生的贖金。 那么, 砸...
    俗然閱讀 324評論 2 2
  • 實驗三小贊 打竹板,笑開顏, 我們幾人來臺前, 來臺前,道心聲, 各位同學仔細聽, 今天不把別的表, 專夸咱們新校...
    暑洪閱讀 351評論 0 1

友情鏈接更多精彩內容