客户端检测

在现实当中，浏览器之间的差异以及不同浏览器的怪癖，多得不胜枚举。因此，客户端检测除了是一种补救措施之外，更是一种行之有效的开发策略

检测web客户端的手段有很多，而且各有利弊。但最重要的是要知道，不到万不得已，就不要使用客户端检测！如果能找到更通用的方法，应优先采用更通用的方法。既是，先设计通用的方案，在针对差异增强该方案

能力检测

能力检测的目标不是识别特定浏览器，而是识别浏览器的能力。只要确定浏览器的能力，就可以给出特定解决方案

检测的时候应该尽可能精确，例如，你想检测sort，不应该只检测是否存在sort属性，而应该更深一步检测sort是否是function类型的。而且需要注意typeof 在各个浏览器之间的差异
能力检测并非浏览器检测，并不能识别出特定的浏览器，因为其他浏览器新版本可能会改变，导致你的检测逻辑不严谨
检测完，应该把检测结果保存起来，这样就不需要每次都进行

例如：早期针对IE的检测：

function getElement(id){
   if(document.getElementById){
       return document.getElementById(id);
   }else if(document.all){
       return document.all[id];
   }else{
      throw new Error("getElementById不可用")
   }
}

怪癖检测

识别浏览器的特殊行为，检测该浏览器存在什么缺陷

一般来说，怪癖都是个别浏览器独有的，故归为bug。
由于检测怪癖需要运行代码，用来检验缺陷。故建议仅检测有直接影响到，并且最好在一开始便执行- 检测

例如： IE8及更早版本，有个bug，新增属性如果与某个Enumerable标为false的原型属性同名，for in 循环无法遍历出它。

用户代理检测

用户代理通过检测用户代理字符串来确定实际使用的浏览器。在服务器端，这是一种常用且广为接受的做法，而在客户端，则被当做万不得已才用的做法，优先级在能力检测和怪癖检测之后。

识别呈现引擎：IE、 Gecko、Webkit、KHTML、Opera

由于历史原因，有些引擎返回的ua中存在诸多不一致的地方。所以在检测的时候，检测的顺序很重要
Opera –> Webkit –> KHTML –> Gecko –> IE.

识别浏览器

大多数情况下，识别呈现引擎足以让我们才去正确的操作。但是，只有呈现引擎还不能说明存在所需的js功能。例如，safari和chrome的呈现引擎都是webkit，但他们的js引擎却不一样。
浏览器：IE , Firefox，safari，konq，opera，chrome

识别平台

通过navigator.platform来检测不同的平台。
navigator.platform 属性可能的值包括：” Win32 “ , “ Win64 “ , “ MacPPC “ , “ MacIntel “ , “ X11 “ , “ Linux i686 “.

识别windows操作系统

通过检测userAgent中的字符串，用正则识别不同的windows版本
win2000之后，大部分浏览器表示操作系统的字符串大部分相同，只有版本号有变化。

识别移动设备

ios设备: 检查是不是Mac OS ，字符串中是否包含“Mobile”，然后再使用正则确定是否存在IOS版本号。
android：搜索字符串“Android”，并取得紧随其后的版本号

识别游戏系统

Wii 或 playstation

总结

用户代理检测是客户端检测的最后一个选择。只要可能应该优先采用能力检测，怪癖检测次之
用户代理检测一般适用于下列情况：

不能直接准确的使用能力检测和怪癖检测。
同一款浏览器在不同的平台上具备不同的能力，这时候就需要确定浏览器位于哪个平台。
为了跟踪分析等目的需要知道确切的浏览器

关于作者：
AndyChen，前端开发，Hybrid App
联系方式：374664805@qq.com
博客：http://chen4342024.github.io/

本文为原创文章，因此转载请保留原出处
本文永久链接：http://chen4342024.github.io/2016/06/29/客户端检测/