浏览器识别

浏览器识别

Javascript 引擎 & 浏览器引擎

Javascript 引擎

• V8: chrome, chromium, edge
• SpiderMonkey: firefox
• JavaScriptCore: safari, other webkit-based browser
• chakra: ie

浏览器引擎

layout/rendering 引擎 + js 引擎

• gecko: firefox
• webkit: safari, 以前的 chrome
• blink: 现在的 chrome
• trident: ie
• presto: opera

通过全局对象 navigator.userAgent 可以获得关于浏览器引擎的信息

套壳浏览器

• 国内浏览器基本都是所谓套壳浏览器，即在 chrome & ie 基础上加点东西，一般极速模式对应 chrome，兼容模式对应 ie
• 但是套壳浏览器可能用的不是最新版内核，或者某些 api 表现不一样…
• 一般套壳浏览器会在 userAgent 上加上自己的厂商标识，不过目前发现 360 没有（后面给出一种暂时可用的 hack）
• ps. 调试过程中发现 360 还可以换 ie11/10/9/8… 的内核，用来测试兼容性还是挺好用的

代码

发现 360 的 navigator.mimeTypes 与 chrome 有很大不同，其中有一些项带着 360 标识，应该别的浏览器不会有吧…

var mime = navigator.mimeTypes;
for (var key in mime) {
    if (/360/.test(mime[key].type)) {
        console.log('360');
    }
}

其他

• 注意低版本浏览器可能不支持 es6 甚至 es5 语法
• 如果整合进项目中，最好将这部分与其他部分分离，不然为了兼容低版本和 ie 需要 webpack 加很多 babel 配置，而且可能还不行…