js获取、比较浏览器名称和版本号的简便方法

1、对浏览器的UA进行查询，获取当前浏览器的名称和版本号：

  getBrowserInfo(){
    let agent = navigator.userAgent.toLowerCase() ;
    let regStr_ie = /msie [\d.]+;/gi ;
    let regStr_ff = /firefox\/[\d.]+/gi
    let regStr_chrome = /chrome\/[\d.]+/gi ;
    let regStr_saf = /safari\/[\d.]+/gi ;
    let regStr_safVersion = /version\/[\d.]+/gi ;
    //IE
    if(agent.indexOf("msie")>0){return agent.match(regStr_ie) ;}
   //firefox
   if(agent.indexOf("firefox")>0){return agent.match(regStr_ff) ;}
   //Chrome
   if(agent.indexOf("chrome")>0){return agent.match(regStr_chrome) ;}
   //Safari
   if(agent.indexOf("safari")>0 && agent.indexOf("chrome")<0){
     let bro= agent.match(regStr_saf)[0].split('/')[0];
     let ver = agent.match(regStr_safVersion)[0].split('/')[1];
     let user = bro+'/'+ver;
     return [user];
   }
 },

注：由于早期浏览器之间相互抄袭伪装，导致其UA可能包含其他浏览器的信息，例如：chrome的UA可能为：

Mozilla/5.0 (Macintosh; Intel Mac OS X 10_6_7) AppleWebKit/534.24 (KHTML, like Gecko) Chrome/11.0.696.65 Safari/534.24

因此chrome和safari的版本号要依据情况单独处理，以上函数返回包含浏览器名称和版本号的数组；

2、获取到版本号后，可用下面的方法进行版本大小判断，版本号可能包含两个小数点，因此分别比较：

  compareBrowser(ver1,ver2) {
    let version1pre = parseFloat(ver1);
    let version2pre = parseFloat(ver2);
    let version1next =  ver1.replace(version1pre + ".","");
    let version2next =  ver2.replace(version2pre + ".","");
      if(version1pre > version2pre){
        return true;
      }else if(version1pre < version2pre){
        return false;
      }else{
        if(version1next >= version2next){
          return true;
        }else{
          return false;
        }
      }
  },

3、调用上述两个方法，可以获取和比较浏览器的名称，对低版本的用户做出提示，操作如下：

checkBrowser(context){
    let info = this.getBrowserInfo()[0].split('/');
    let browser = info[0];
    let version = info[1];
    if(browser==='chrome'){
      let flag = this.compareBrowser(version,'61.0');
      if(!flag){
        context.$router.push('/error');
      }
    }
    else if(browser==='firefox'){
      let flag = this.compareBrowser(version,'55.0');
      if(!flag){
        context.$router.push('/error');
      }
    }
    else if(browser==='safari'){
      let flag = this.compareBrowser(version,'8.08');
      if(!flag){
        context.$router.push('/error');
      }
    }
  },

注：上述方法是在vue2.0下调用比较函数对浏览器版本进行判断，当版本低于指定版本时进行页面跳转；

js获取、比较浏览器名称和版本号的简便方法

猜你喜欢