現(xiàn)如今的瀏覽器眾多,版本繁雜, 為了適應(yīng)版本需要確定瀏覽器的類型,
尤其是360瀏覽器又分為安全瀏覽器和急速瀏覽器,特此封裝一個可用的方法庫,可在github上查看
GitHub
其中ie和chrome可查看version,并能區(qū)分360安全瀏覽器和急速瀏覽器
/**
* 瀏覽器內(nèi)核判斷
*/
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 內(nèi)核瀏覽器類型
* @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已經(jīng)失效 此方法不能判斷安全與急速
// return chromeAppKeysLength > 5 ? '360ee' : '360se';//通過app下的keys個數(shù)判斷
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 ''
}
根據(jù)瀏覽器判斷當(dāng)前系統(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默認(rèn)以急速模式打開.
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><!--指定ie用chrome內(nèi)核渲染 需要安裝GCF插件-->
<meta name="renderer" content="webkit"><!--360瀏覽器默認(rèn)webkit模式-->
參考:https://github.com/cloudcome/alien/blob/master/src/core/navigator/shell.js