vue 获取当前登录的浏览器类型

这里注意罗列了常用的几种浏览器：

 1. 谷歌浏览器   2.火狐浏览器  3. Edge浏览器  4. IE浏览器  5. 欧鹏浏览器  6.苹果浏览器 

方法一、 

//方法一、
// 获取当前登录的浏览器
export function getBrowserInfo(){
  var agent = navigator.userAgent.toLowerCase() ;
  // console.log("agent:", agent);
  var arr = [];
  var system = agent.split(' ')[1].split(' ')[0].split('(')[1];
  arr.push(system);
  var regStr_edge = /edge\/[\d.]+/gi;
  var regStr_ie = /trident\/[\d.]+/gi ;
  var regStr_ff = /firefox\/[\d.]+/gi;
  var regStr_chrome = /chrome\/[\d.]+/gi ;
  var regStr_saf = /safari\/[\d.]+/gi ;
  var regStr_opera = /opr\/[\d.]+/gi;
  //IE
  if(agent.indexOf("trident") > 0){
    arr.push(agent.match(regStr_ie)[0].split('/')[0]);
    arr.push(agent.match(regStr_ie)[0].split('/')[1]);
    return arr;
  }
  //Edge
  if(agent.indexOf('edge') > 0){
    arr.push(agent.match(regStr_edge)[0].split('/')[0]);
    arr.push(agent.match(regStr_edge)[0].split('/')[1]);
    return arr;
  }
  //firefox
  if(agent.indexOf("firefox") > 0){
    arr.push(agent.match(regStr_ff)[0].split('/')[0]);
    arr.push(agent.match(regStr_ff)[0].split('/')[1]);
    return arr;
  }
  //Opera
  if(agent.indexOf("opr")>0){
    arr.push(agent.match(regStr_opera)[0].split('/')[0]);
    arr.push(agent.match(regStr_opera)[0].split('/')[1]);
    return arr;
  }
  //Safari
  if(agent.indexOf("safari") > 0 && agent.indexOf("chrome") < 0){
    arr.push(agent.match(regStr_saf)[0].split('/')[0]);
    arr.push(agent.match(regStr_saf)[0].split('/')[1]);
    return arr;
  }
  //Chrome
  if(agent.indexOf("chrome") > 0){
    arr.push(agent.match(regStr_chrome)[0].split('/')[0]);
    arr.push(agent.match(regStr_chrome)[0].split('/')[1]);
    return arr;
  }
  // else{
  //   arr.push('请更换主流浏览器,例如chrome,firefox,opera,safari,IE,Edge!')
  //   return arr;
  // }
}

方法二、

//方法二、
// 获取当前登录的浏览器
export function getLogoinBrowser(){
  var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
  // console.log("loginuserAgent:", userAgent)
  //判断是否Opera浏览器
  if (userAgent.indexOf("Opera") > -1) {
    return "Opera"
  };

  //判断是否Edge浏览器
  if (userAgent.indexOf("Edg") > -1){
    return 'Edge'
  }

  //判断是否Firefox浏览器
  if (userAgent.indexOf("Firefox") > -1) {
    return "firefox";
  }

  //判断是否Chrome浏览器
  if (userAgent.indexOf("Chrome") > -1){
    return "Chrome";
  }

  //判断是否Safari浏览器
  if (userAgent.indexOf("Safari") > -1) {
    return "Safari";
  }

  //判断是否IE浏览器
  if (userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1 && !isOpera) {
    return "IE";
  }
  if ( userAgent.indexOf("Trident") > -1){
    return "IE";
  }
}

效果图、谷歌浏览器：

 效果图、火狐浏览器：

  效果图、Edge浏览器：

  效果图、IE浏览器： 

 

 最后为了方便大家的沟通与交流请加QQ群： 625787746

请进QQ群交流：【IT博客技术分享群①】：正在跳转