用户代理字符串userAgent可实现的四个识别


Posted in Javascript onSeptember 20, 2015

定义

用户代理字符串:navigator.userAgent

HTTP规范明确规定,浏览器应该发送简短的用户代理字符串,指明浏览器的名称和版本号。但现实中却没有这么简单。

发展历史

【1】1993年美国NCSA国家超级计算机中心发布了世界上第一款web浏览器Mosaic,该浏览器的用户代理字符串为Mosaic/0.9

【2】Netscape公司进入浏览器开发领域,将自己产品的代号定名了Mozilla(Mosaic Killer)的简写,用户代理字符串格式为Mozilla/版本号 [语言] (平台;加密类型)

【3】IE发布的第一款赢得用户广泛认可的web浏览器IE3,当时Netscap已经占据了绝对市场份额,为了让服务器能够检测到IE,IE将用户代理字符串修改成兼容Netscape的形式:Mozilla/2.0(compatible;MSIE版本号;操作系统)

【4】各浏览器陆续出现,用户代理字符串的显示格式也越来越类似…… 

测试工具

 利用各桌面浏览器调试工具,主要是IE调试工具及chrome的emulation手机调试工具

 用户代理字符串userAgent可实现的四个识别

桌面端测试结果

【1】IE

[1.1]IE3

Mozilla/2.0 (compatible; MSIE3.02; windows 95)

[1.2]IE6

Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1)

[1.3]IE7

Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.0)

[1.4]IE8

Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; Trident/4.0)

[1.5]IE9

Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; Trident/5.0)

[1.6]IE10

Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; Trident/6.0)

[1.7]IE11

Mozilla/5.0 (MSIE 9.0; Windows NT 6.1; WOW64; Trident/7.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET

CLR 3.0.30729; .NET4.0C; .NET4.0E; InfoPath.3; GWX:QUALIFIED; rv:11.0) like Gecko

【2】chrome

Mozilla/5.0 (Windows NT 6.1; WOW64)G AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.93 Safari/537.36

【3】safari

Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/534.57.2 (KHTML, like Gecko) Version/5.1.7 Safari/534.57.2

【4】firefox

Mozilla/5.0 (Windows NT 6.1; WOW64; rv:40.0) Gecko/20100101 Firefox/40.0

【5】opera

Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.85 Safari/537.36 OPR/32.0.1948.25

移动端测试结果

【1】ipad

Mozilla/5.0 (iPad; CPU OS 7_0 like Mac OS X) AppleWebKit/537.51.1 (KHTML, like Gecko) Version/7.0 Mobile/11A465 Safari/9537.53

【2】iphone

Mozilla/5.0 (iPhone; CPU iPhone OS 8_0 like Mac OS X) AppleWebKit/600.1.3 (KHTML, like Gecko) Version/8.0 Mobile/12A4345d Safari/600.1.4

【3】android

Mozilla/5.0 (Linux; Android 4.2.2; GT-I9505 Build/JDQ39) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/31.0.1650.59 Mobile Safari/537.36

识别浏览器内核

常见的内核有Trident、Gecko和Webkit

[注意]因为Trident和Webkit的用户代理字符串中可能会出现 like Gecko的字眼,所以最后再测Gecko

function whichEngine(){
 var ua = navigator.userAgent;
 //Trident内核
 if(/Trident/.test(ua)){
  return "Trident";
 }
 //Webkit内核
 if(/WebKit/.test(ua)){
  return "WebKit";
 }  
 //Gecko内核
 if(/Gecko/.test(ua)){
  return "Gecko";
 }
}
console.log(whichEngine());//IE11下显示"Trident"

识别浏览器版本

【1】IE

IE3-IE10都可以通过MSIE的版本号来判断,因为有的IE11并不出现MSIE字符,且safari中也有rv字段,所以IE11需要通过rv后的版本号和Trident来配合判断

function isIE(){
 var ua = navigator.userAgent;
 //检测Trident引擎,IE8+
 if(/Trident/.test(ua)){
  //IE11+
  if(/rv:(\d+)/.test(ua)){
   return RegExp["$1"];
  } 
  //IE8-IE10 
  if(/MSIE (\d+)/.test(ua)){
   return RegExp["$1"];
  }  
 }
 //检测IE标识,IE7-
 if(/MSIE (\d+)/.test(ua)){
  return RegExp["$1"];
 } 
}
console.log(isIE());//只有IE会返回版本号,其他浏览器都返回undefined

【2】chrome

function isChrome(){
 var ua = navigator.userAgent;
 //先排除opera,因为opera只是在chrome的userAgent后加入了自己的标识
 if(!/OPR/.test(ua)){
  if(/Chrome\/(\S+)/.test(ua)){
   return RegExp["$1"];
  } 
 } 
}
console.log(isChrome());//只有Chrome会返回版本号45.0.2454.93,其他浏览器都返回undefined

【3】safari

function isSafari(){
 var ua = navigator.userAgent;
 //先排除opera
 if(!/OPR/.test(ua)){
  //检测出chrome和safari浏览器
  if(/Safari/.test(ua)){
   //检测出safari
   if(/Version\/(\S+)/.test(ua)){
    return RegExp["$1"];
   }  
  }
 } 
}
console.log(isSafari());//只有safari会返回版本号5.1.7,其他浏览器都返回undefined

【4】firefox

function isFireFox(){
 if(/Firefox\/(\S+)/.test(navigator.userAgent)){
  return RegExp["$1"];
 } 
}
console.log(isFireFox());//只有firefox会返回版本号40.0,其他浏览器都返回undefined

【5】opera

function isOpera(){
 if(/OPR\/(\S+)/.test(navigator.userAgent)){
  return RegExp["$1"];
 } 
}
console.log(isOpera());//只有opera会返回版本号32.0.1948.25,其他浏览器都返回undefined

识别操作系统

使用navigator.platform检测操作系统更加简单,因为其可能包括的值为“Win32”、“Win64”、“MacPPC”、“MacIntel”、“X11”和"Linux i686"等,且在不同浏览器中是一致的。

而通过navigator.userAgent可以来得到window系统的详细信息。

windows版本                        ->             内核版本
Windows XP                        ->             5.1
Windows Vista                     ->             6.0
Windows 7                         ->             6.1
Windows 8                         ->             6.2
Windows 8.1                       ->             6.3
Windows 10技术预览版               ->             6.4
Windows 10(Build 9880+)           ->             10

function whichSyStem(){
 var ua = navigator.userAgent;
 var pf = navigator.platform;
 if(/Mac/.test(pf)){
  return "Mac";
 }
 if(/X11/.test(pf) || /Linux/.test(pf)){
  return "Linux";
 }
 if(/Win/.test(pf)){
  if(/Windows NT (\d+\.\d+)/.test(ua)){
   switch(RegExp["$1"]){
    case "5.0":
     return "Windows 2000";
    case "5.1":
     return "Windows XP";
    case "6.0":
     return "Windows Vista";
    case "6.1":
     return "Windows 7";
    case "6.2":
     return "Windows 8";
    case "6.3":
     return "Windows 8.1";
    case "6.4":
    case "10":
     return "Windows 10";     
   }
  }
 }
}
console.log(whichSyStem())//Windows 7

识别移动端设备

function whichMobile(){
 var ua = navigator.userAgent;
 if(/iPhone OS (\d+_\d+)/.test(ua)){
  return 'iPhone Mac' + RegExp.$1.replace("_",".");
 }
 if(/iPad.+OS (\d+_\d+)/.test(ua)){
  return 'iPad Mac' + RegExp.$1.replace("_",".")
 }
 if(/Android (\d+\.\d+)/.test(ua)){
  return 'Android' + RegExp["$1"];
 }
}
console.log(whichMobile())//Android 5.1
Javascript 相关文章推荐
jquery 新手学习常见问题解决方法
Apr 18 Javascript
Firefox中beforeunload事件的实现缺陷浅析
May 03 Javascript
AngularJS HTML编译器介绍
Dec 06 Javascript
[js高手之路]从原型链开始图解继承到组合继承的产生详解
Aug 28 Javascript
浅析JS抽象工厂模式
Dec 14 Javascript
vue使用Google地图的实现示例代码
Dec 19 Javascript
使用 Vue cli 3.0 构建自定义组件库的方法
Apr 30 Javascript
vue使用混入定义全局变量、函数、筛选器的实例代码
Jul 29 Javascript
用 js 写一个 js 解释器过程详解
Aug 02 Javascript
Vue数字输入框组件示例代码详解
Jan 15 Javascript
node.JS路径解析之PATH模块使用方法详解
Feb 06 Javascript
Postman环境变量全局变量使用方法详解
Aug 13 Javascript
jquery+正则实现统一的表单验证
Sep 20 #Javascript
基于JavaScript实现生成名片、链接等二维码
Sep 20 #Javascript
jQuery实现单击弹出Div层窗口效果(可关闭可拖动)
Sep 19 #Javascript
JS+CSS实现简单滑动门(滑动菜单)效果
Sep 19 #Javascript
jquery实现点击弹出带标题栏的弹出层(从右上角飞入)效果
Sep 19 #Javascript
jQuery实现点击按钮弹出可关闭层的浮动层插件
Sep 19 #Javascript
JS基于myFocus库实现各种功能的tab选项卡切换效果
Sep 19 #Javascript
You might like
古巴咖啡 Cubita琥爵咖啡 独特的加勒比海风味咖啡
2021/03/06 新手入门
PHP下常用正则表达式整理
2010/10/26 PHP
CentOS下PHP7的编译安装及MySQL的支持和一些常见问题的解决办法
2015/12/17 PHP
Yii2下session跨域名共存的解决方案
2017/02/04 PHP
js的表单操作 简单计算器
2011/12/29 Javascript
javascript中动态加载js文件多种解决办法总结
2013/11/15 Javascript
浅谈JavaScript函数参数的可修改性问题
2013/12/05 Javascript
JavaScript实现将UPC转换成ISBN的方法
2015/05/26 Javascript
Jquery左右滑动插件之实现超级炫酷动画效果附源码下载
2015/12/02 Javascript
基于touch.js手势库+zepto.js插件开发图片查看器(滑动、缩放、双击缩放)
2016/11/17 Javascript
详解Angular2响应式表单
2017/06/14 Javascript
微信小程序 共用变量值的实现
2017/07/12 Javascript
详解AngularJS 过滤器的使用
2018/06/02 Javascript
深入了解响应式React Native Echarts组件
2019/05/29 Javascript
swiper4实现移动端导航切换
2020/10/16 Javascript
Vue实现背景更换颜色操作
2020/07/17 Javascript
js实现飞机大战游戏
2020/08/26 Javascript
python实现一次创建多级目录的方法
2015/05/15 Python
在Django中限制已登录用户的访问的方法
2015/07/23 Python
Python中pow()和math.pow()函数用法示例
2018/02/11 Python
python 对给定可迭代集合统计出现频率,并排序的方法
2018/10/18 Python
解决Python安装时报缺少DLL问题【两种解决方法】
2019/07/15 Python
Django时区详解
2019/07/24 Python
如何修复使用 Python ORM 工具 SQLAlchemy 时的常见陷阱
2019/11/19 Python
tensorflow使用range_input_producer多线程读取数据实例
2020/01/20 Python
django-csrf使用和禁用方式
2020/03/13 Python
HTML5实现获取地理位置信息并定位功能
2015/04/25 HTML / CSS
保加利亚手表、香水、化妆品和珠宝购物网站:Brasty.bg
2020/04/22 全球购物
Ajxa常见问题都有哪些
2014/03/26 面试题
我的祖国演讲稿
2014/05/04 职场文书
教室标语大全
2014/06/21 职场文书
第一批党的群众路线教育实践活动总结报告
2014/07/03 职场文书
道路施工安全责任书
2014/07/24 职场文书
电话客服工作职责
2014/07/27 职场文书
机票销售员态度不好检讨书
2014/09/27 职场文书
Mysql将字符串按照指定字符分割的正确方法
2022/05/30 MySQL