Fork me on GitHub

JavaScript:用户代理检测:通过浏览器识别平台、操作系统等(Windows, Mac, iOS,iPad等)

 客户端检测经常用的方法:能力检测、怪癖检测和用户代理检测。

 能力检测:在写代码前先检测浏览器的能力。

怪癖检测:实际上是浏览器现存的bug。

用户代理检测:通过检测用户代理字符串来识别浏览器。

一般优先考虑使用 能力检测,怪癖检测是第二种选择,用户代理检测是最后一种方案。

  1 var client = function () {
  2     // 引擎
  3     var engine = {
  4         ie: 0,
  5         gecko: 0,
  6         webkit: 0,
  7         khtml: 0,
  8         opera: 0,
  9         version: null // 版本号
 10     };
 11     // 浏览器
 12     var brower = {
 13         ie: 0,
 14         firefox: 0,
 15         safari: 0,
 16         konq: 0,
 17         opera: 0,
 18         chrome: 0,
 19         version: null // 版本号
 20     };
 21 
 22     // 平台、设备、操作系统
 23     var system = {
 24         win: false,
 25         mac: false,
 26         xll: false,// Unix
 27 
 28         // 移动设备
 29         iphone: false,
 30         ipod: false,
 31         ipad: false,
 32         ios: false,
 33         android: false,
 34         nokiaN: false,// 诺基亚N系列手机
 35         winMobile: false,
 36 
 37         // 游戏系统
 38         wii: false,// 任天堂
 39         ps: false
 40     };
 41 
 42     // 检测引擎和浏览器
 43     var ua = navigator.userAgent;
 44     if (window.opera) {
 45         engine.version = brower.version = window.opera.version();
 46         engine.opera = brower.opera = parseFloat(engine.version);
 47     } else if (/AppleWebKit\/(\S+)/.test(ua)) {
 48         engine.version = RegExp["$1"];
 49         engine.webkit = parseFloat(engine.version);
 50 
 51         // chrome or safari
 52         if (/Chrome\/(\S+)/.test(ua)) {
 53 
 54             if (/Edg\/(\S+)/ig.test(ua)) {
 55                 engine.version = brower.version = RegExp["$1"];
 56                 engine.ie = brower.ie = parseFloat(engine.version);
 57             } else {
 58                 brower.version = RegExp["$1"];
 59                 brower.chrome = parseFloat(brower.version);
 60             }
 61         } else if (/Version\/(\S+)/.test(ua)) {
 62             brower.version = RegExp["$1"];
 63             brower.safari = parseFloat(brower.version);
 64         } else {
 65             // 近似确定版本号
 66             var safariVersion = 1;
 67             if (engine.webkit < 100) {
 68                 safariVersion = 1;
 69             } else if (engine.webkit < 312) {
 70                 safariVersion = 1.2;
 71             } else if (engine.webkit < 412) {
 72                 safariVersion = 1.3;
 73             } else {
 74                 safariVersion = 3;
 75             }
 76             brower.safari = brower.version = safariVersion;
 77         }
 78     } else if (/KHTML\/(\S+)/.test(ua) || /Konqueror\/([^;]+)/.test(ua)) {
 79         engine.version = brower.version = RegExp["$1"];
 80         engine.khtml = brower.konq = parseFloat(brower.version);
 81 
 82     } else if (/rv:([^\)]+)\) Gecko\/\d{8}/.test(ua)) {
 83         engine.version = RegExp["$1"];
 84         engine.gecko = parseFloat(engine.version);
 85 
 86         // 确定是否是Firefox
 87         if (/FireFox\/(\S+)/.test(ua)) {
 88             brower.version = RegExp["$1"];
 89             brower.firefox = parseFloat(brower.version);
 90         }
 91 
 92     } else if (/MSIE ([^;]+)/.test(ua)) {
 93         // 不适用IE11和Edge
 94         engine.version = brower.version = RegExp["$1"];
 95         engine.ie = brower.ie = parseFloat(engine.version);
 96     } else if (/rv:([^\)]+)\)/.test(ua)) {
 97         // 判断IE11
 98         engine.version = brower.version = RegExp["$1"];
 99         engine.ie = brower.ie = parseFloat(engine.version);
100     }
101 
102    
104     //  检测浏览器
105     brower.ie = engine.ie;
106     brower.opera = engine.opera;
107 
108     // 检测平台
109     var p = navigator.platform;
110     system.win = p.indexOf("Win") == 0;
111     system.mac = p.indexOf("Mac") == 0;
112     system.xll = (p.indexOf("Linux") == 0) || (p == "Xll");
113 
114     // 检测windows操作系统
115     if (system.win) {
116         if (/Win(?:dows )?([^do]{2})\s?(\d+\.\d+)?/.test(ua)) {
117             if (RegExp["$1"] == "NT") {
118                 switch (RegExp["$2"]) {
119                     case "5.0":
120                         system.win = "2000";
121                         break;
122                     case "5.1":
123                         system.win = "XP";
124                         break;
125                     case "6.0":
126                         system.win = "Vista";
127                         break;
128                     case "6.1":
129                         system.win = "7";
130                         break;
131                     default:
132                         system.win = "NT";
133                         break;
134 
135                 }
136             } else if (RegExp["$1"] == "9x") {
137                 system.win = "ME";
138             } else {
139                 system.win = RegExp["$1"]
140             }
141         }
142     }
143 
144     // 移动设备
145     system.iphone = ua.indexOf("iPhone") > -1;
146     system.ipod = ua.indexOf("iPod") > -1;
147     system.ipad = ua.indexOf("iPad") > -1;
148     system.nokiaN = ua.indexOf("NokiaN") > -1;
149 
150     // windows phone
151     if (system.win == "CE") {
152         system.winMobile = system.win;
153     } else if (system.win == "Ph") {
154         if (/Windows Phone OS (\d+.\d+)/.test(us)) {
155             system.win = "Phone";
156             system.winMobile = parseFloat(RegExp["$1"])
157         }
158     }
159 
160     // 检测IOS版本
161     if (system.mac && ua.indexOf("Mobile") > -1) {
162         if (/CPU (?:iPhone )?OS (\d+_\d+)/.test(ua)) {
163             system.ios = parseFloat(RegExp.$1.replace("_", "."));
164 
165         } else {
166             system.ios = 2;
167         }
168     }
169 
170     // 检测Android版本
171     if (/Android (\d+\.\d+)/.test(ua)) {
172         system.android = parseFloat(RegExp.$1);
173     }
174 
175     // 游戏系统
176     system.wii = ua.indexOf("Wii") > -1;
177     system.ps = /playstation/i.test(ua);
178 
179     return {
180         engine: engine,
181         brower: brower,
182         system: system
183     };
184 
185 }();

 

 

Windows操作系统下部分浏览器测试结果:

 

posted @ 2022-01-14 22:00  元芳啊  阅读(314)  评论(0编辑  收藏  举报