根据userAgent值的特性判断客户端设备及浏览器类型

https://blog.csdn.net/I_need_a_name_/article/details/88432278

前文《Web开发兼容性系列文章(一):不一样设备浏览器的userAgent值大全》罗列了经常使用电脑浏览器及智能手机浏览器的userAgent值html

这里对浏览器各自的userAgent特色作一分析,并给出判断方法:
 linux

Windows操做系统浏览器系列:
 android

  • IE浏览器系列:
    特征表现:均以 "mozilla/" 开头,"msie x.0;" 中的x表示其版本;
    判断方法:粗略判断能够只检索 "msie x.0;" 字符串便可,严格判断可检索 "mozilla/x.0 (compatibal; msie x.0; windows nt",不过通常没有这个必要
  • Windows版Firefox:
    特征表现:以"mozilla/x.0"开头,包含"windows nt","gecko/"和"firefox/" ;
    判断方法:粗略判断能够只检索 "firefox/"和"windows nt" 字符串,严格判断能够检索"mozilla/" ,"windows nt","gecko/"和"firefox/" 四个字符串;
  • Windows版Chrome:
    特征表现: 以"mozilla/x.0"开头,包含"windows nt","chrome/",同时包含"applewebkit/","safari/";
    判断方法:粗略判断能够只检索 "windows nt"和"chrome/"字符串,严格判断能够同时检索 "mozilla/" ,"windows nt","applewebkit/","safari/","chrome/" 五个字符串;
  • Windows版Opera:
    特征表现:以"opera/"开头,含有"windows nt","presto/" 字符串;
    判断方法:粗略判断只检索 "windows nt"和"opera/"字符串,严格判断同时检索 "opera/","windows nt" 和 "presto/";
  • Windows版Safari:
    特征表现:以"mozilla/"开头,同时含有"windows nt","applewebkit/","safari/";
    判断方法:粗略判断能够检索含有 "windows nt","safari/" 同时不包含 "chrome/",严格判断须要同时含有"mozilla/","windows nt","applewebkit/","safari/"可是不包含"chrome/";  
  • 小结:Windows操做系统上的浏览器userAgent均包含"windows nt"字符串来表征windows操做系统。



iPhone平台浏览器系列:

  • iPhone自带safari:
    特征表现:以"mozilla/"开头,含有"iphone"字符串,同时含有 "mobile/","safari/"字符串;
    判断方法:粗略判断只检索 "iphone"和"safari/"字符串,严格判断则要同时包含 "mozilla/","iphone","mobile/","safari/"四个字符串
  • iPhone版Opera Mobile:
    特征表现: 以"opera/"开头,含有"iphone"字符串,同时含有 "opera mini/","presto/"字符串;
    判断方法:粗略判断只检索 "iphone"和"opera/"字符串,严格判断则要同时包含 "opera/","iphone","opera mini/","presto/"四个字符串
  • 小结:iPhone手机上的浏览器userAgent均包含"iphone"字符串



Android平台浏览器系列:

  • Android自带浏览器(有人说实际上是就chrome,但google本身未作表示,且还在开发一个Android上运行的Chrome to Phone):
    特征表现: 以"mozilla/"开头,含有"android"和"linux" 字符串,同时含有 "applewebkit/","mobile safari/"字符串;
    判断方法:由于还不知道Android上将来会不会有独立的safari(估计不会了),因此建议直接严格判断,检索 "mozilla/","android","linux","applewebkit/","mobile safari/"五个字符串
  • Android版Opera Mobile:
    特征表现: 以"opera/"开头,含有"android"和"linux" 字符串,同时含有 "opera mobi/","presto/"字符串;
    判断方法:粗略判断只检索 "android"和"opera/",严格判断则要同时包含"opera/","android","linux","opera mobi/","presto/"五个字符串
  • Android版Firefox:
    特征表现:以"mozilla/"开头,含有"android"和"linux" 字符串,同时含有 "firefox/","gecko/","fennec/"字符串; 
    判断方法:粗略判断只检索 "android"和"firefox/",严格判断则要同时包含"mozilla/","android","linux","firefox/","gecko/","fennec/"六个字符串 
  • 小结:Android平台上的浏览器userAgent均包含"android"和"linux"字符串



      以上对windows、iphone、android三大平台的主流浏览器解析就基本结束了,其余平台的linux估计至少与android平台应该相似,而采用了Mac OS的iPad和麦金塔应该与iphone平台相似,故而暂时先不作解析,也由于手头没有那么多设备和操做系统来测试,但愿往后可以补上。


      如今的网站产品开发要求跟之前又不同了,由于不只要知足电脑浏览,还须要知足用户经过智能手机(这里仅指iphone、android、windows phone等真正的智能手机,blackberry和palm这样的小众半智能系统暂时不考虑,至于symbian这个伪智能系统就一边玩去吧)经过以上三个具备表明性的平台,也大体能够推测出根据浏览器userAgent判断用户设备的解决方案了。



一、若是须要判断操做系统,方法比较简单,在userAgent里面检索如下字符串:

  • 含有"windows nt":显而易见了,windows操做系统,nt后面的版本号能够判断OS版本;
  • 含有"mac":苹果的Mac OS X或者其余Mac OS内核的系统;
  • 含有"iphone":苹果iphone手机专有的,通常状况下也应该含有"mac";
  • 含有"ipad":苹果iPad平板电脑(资料代表iPad的浏览器userAgent同时含有"mac","iphone","ipad");
  • 含有"linux":Linux操做系统或者其余以linux做为内核的操做系统;
  • 含有"android":谷歌的Android操做系统,有多是智能手机,也有多是安卓版的平板电脑哦,通常状况下android平台上的userAgent也应该包含"linux";
  • 含有"unix","sunos","bsd"三者之一:Unix系统,其实对这个系统的用户体验问题,目前几乎能够不用考虑了;
  • 含有"ubuntu":ubuntu定制版的linux
  • ……

你也看到了,判断操做系统及其版本其实并不一直有用,但总有能用到的地方,好比开发专门针对iphone、ipad、android等设备屏幕分辨率的页面


二、判断浏览器的内核,方法也不困难,我本身琢磨出来的,不必定都对啊:

  • IE(Trident)内核(IE for Mac, IEs4Linux之类的就不用说了,只考虑windows下的):以"mozilla/"开头,含有"windows nt"和"msie"字符串;
  • Firefox(Gecko)内核:以"mozilla/"开头,含有"firefox/"和"gecko/"字符串的就是啦,其中Android版的还带有"fennec/"字符串;
  • Opera()内核:以"opera/"开头,含有"presto/"字符串,其中iphone版还带有"opera mini/",Android版也带有"opera mobi/";
  • Webkit内核:以"mozilla/"开头,含有"applewebkit/"和"safari/"字符串,其中带有"chrome/"的就是Chrome浏览器,不带的就是Safari或其余;
  • 以上就是主要的浏览器内核了

      浏览器内核才是解决兼容性的关键问题所在,然而,这个兼容性问题已经有jQuery和Extjs等框架帮你解决了,所以这个判断只针对个别页面的CSS样式在不一样内核渲染效果不一样的状况下使用,固然了,一样的内核在智能手机和电脑等不一样设备上渲染结果也不一样,这一点也须要注意。



三、判断浏览器useAgent的实际应用举例:

  • 不一样浏览器内核对页面的渲染效果不一样,虽然已经有jQuery和Extjs等为咱们作了兼容处理,可是依然会有一些细小的差异须要咱们单独处理,此时须要判断浏览器内核;
  • 用户并不只仅是经过电脑访问网站的,随着智能手机的日益普及还有平板电脑的大行其道,使用这二者来上网的比例愈来愈高,怎么办?平板电脑还好,屏幕大分辨率高,智能手机受限于他的屏幕尺寸和分辨率,虽有强劲的处理能力,也能够完美支持现有的网站,可是为客户多考虑一点总没有坏处你说对吧?毕竟经过局部缩放拖拽的方式看网页很不舒服,这时呢,咱们就能够专门为iphone、android这样的窄条屏幕提供一个专用版原本布局了,一来提高浏览体验,二来下降网络流量,加快访问速度;
  • 作访客流量分析,经过判断客户浏览器类型并记录其数量,来优化设计本身的网站,以分别提高其客户体验
  • ……

 

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值