1.背景
有好多瀏覽器使用了chrome內核,比如opera和很多國產瀏覽器。因此它們的userAgent中就會出現 ‘chrome’ 的字樣。這樣根據userAgent判斷時就要先判斷是否有其他瀏覽器標誌。
2.說明
判斷是否是chrome瀏覽器採用黑名單的方式。即判斷ua是否有chrome標識,然後剔除使用chrome內核的非chrome瀏覽器。那麼如何判斷一個使用chrome內核的瀏覽器是不是chrome呢?
大部分瀏覽器的ua裏都有自己的標誌,如:
‘opera’或 ‘OPR’ // opera
'ubrowser', // UC
'taobrowser', // 淘寶
'lbbrowser', // 獵豹
'qqbrowser', // QQ
'maxthon', // 遨遊
'bidubrowser' // 百度
ua中有上述標識的,可以列入黑名單
但是有兩個瀏覽器(目前發現),最新版本中的ua裏,沒有加自己的標識,就是360和搜狗。這兩個瀏覽器需要通過navigator.mimeTypes來判斷。360的navigator.mimeTypes[0].type爲 ‘application/vnd.chromium.remoting-viewer’,搜狗的navigator.mimeTypes[1].type爲 ‘application/sogou-native-widget-plugin’。這兩個標識都是chrome沒有的,因此可以通過這個標識將這兩個瀏覽器與chrome區分。由於不知道是這兩個標識一定存在於navigator.mimeTypes的固定位置,因此最好遍歷navigator.mimeTypes,如果存在這兩個標識,就判定爲非chrome。
3.代碼
<!DOCTYPE html>
<html>
<head>
<title>test</title>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
</head>
<body>
</body>
<script type="text/javascript">
var markList = [
'ubrowser', // UC
'taobrowser', // 淘寶
'lbbrowser', // 獵豹
'qqbrowser', // QQ
'maxthon', // 遨遊
'bidubrowser' // 百度
];
var mimeTypeList = [
'application/vnd.chromium.remoting-viewer', // 360
'application/sogou-native-widget-plugin' // 搜狗
]
function isChrome() {
var ua = navigator.userAgent.toLowerCase();
var mimeTypes = navigator.mimeTypes;
return (ua.indexOf('chrome') !== -1)
&& !hasOtherMark(ua)
&& !isInMimeList(mimeTypes);
}
function hasOtherMark(ua) {
var flag = false;
$.each(
markList,
function (index, item) {
if (ua.indexOf(item) !== -1) {
flag = true;
return false;
}
}
);
return flag;
}
function isInMimeList(mimeTypes) {
var flag = false;
while (mimeTypeList.length) {
if (flag) {
return flag;
}
var mimeType = mimeTypeList.pop();
$.each(
mimeTypes,
function (index, item) {
if (item.type.toLowerCase() === mimeType) {
flag = true;
return false;
}
}
);
}
return flag;
}
alert('browser is chrome: ' + isChrome())
</script>
</html>