js判断chrome和360极速浏览器和360安全浏览器

在做项目的时候有用到判断不同浏览器的这个需求，然后就是按部就班的根据window.navigator对象里面的user-agent属性来判断，如果你以为就这么简单的话那就错来。以下是我自己遇到的几个坑，在此记录以下

1.360浏览器在不同域名访问的情况下user-agent是不一样的，比如说在https://hao.360.com/这个域名下，展示为

从其他域名访问如下：

通过上面两张图片可以看出想单独的依靠user-agent来判断360浏览器是行不通的。然后借鉴网上其他朋友的另外一种方法，判断mimeTypes，具体就是说360极速浏览器的这个属性里面会有一个mimeTypes的的type属性为application/vnd.chromium.remoting-viewer

以下两张图片分别展示windows上面谷歌浏览器和360极速浏览器中不同的mimetypes

 

 

 

具体代码如下：如果是360极速则返回true，否则false。

var is360js = _mime("type", "application/vnd.chromium.remoting-viewer");
      //判断mime
     function _mime(option, value) {
        //debugger;
        let mimeTypes = navigator.mimeTypes;
        for (var mt in mimeTypes) {
          console.log('type:',mimeTypes[mt][option]);
          if (mimeTypes[mt][option] == value) {
            return true;
          }
        }
        return false;
      },

这个方法确实可行，但是仅仅只限于在windows电脑上，在mac上我发现谷歌浏览器和360极速浏览器里面的mimeTypes是完全一样的，所以根据这个方法也不行，存在兼容性问题，大家自己也可以测试一下。之后又是一通乱七八糟的百度着答案，花费来许久也没有找到解决方案，然后自己在两个不同的浏览器中反复的查看navigator有什么不同之处，最后还确实发现了一点问题，--------------------在谷歌浏览器的navigator对象里面存在userActivation属性，而在360极速里面却没有

 

谷歌：

 

360极速：

 

所以我就根据这个属性来判断测试后发现确实可行。具体代码如下：

      var is360 = is360ByUserActivationProperty();
      //根据userActivation属性来判断360极速
      function is360ByUserActivationProperty(){
        //debugger;
        let navigator = window.navigator;
        if(navigator.userActivation){
          return false;//chrome
        }else{
          return true;//360极速
        }
      },

总结：这个方法没有具体的在不同的浏览器之间做过测试所以不知道可用性高不高以及浏览器不同版本之间会不会有兼容性问题，所以大家可以借鉴一下，如果哪位朋友有更好的方法也希望可以给我指点一下！！！