利用platform库获取浏览器和操作系统版本

一时失言乱红尘 2022-07-24 07:29 191阅读 0赞

## 原生方法检测 ##

网站获取用户的浏览器和操作系统版本是一个很常见的需求，但是细说起来这个功能的实现并不简单。一般情况下有两种思路。

一是利用用户代理UserAgent来判断浏览器和OS的版本，因为各个平台和浏览器的UA都不一样。但是这种方法存在一个局限性，由于各方面的原因，浏览器的UA并不是一个简单的字符串，而是包含了各种信息的复杂字符串，而且由于UA可以被客户端修改，因此这种检测方法并不完全准确。以下是我的UA，大家可以猜猜我的浏览器和操作系统各是什么版本的。

> Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.102 Safari/537.36

二就是通过各个浏览器之间实现的不同来判断。比如说只有IE浏览器支持ActiveX控件，因此通过在JavaScript代码中查看浏览器是否存在ActiveX控件属性即可判断该浏览器是否是IE浏览器。这种方法的优点是检测准确，而且相比检测UA来说速度更快。但是由于这种方法以来浏览器的具体实现，因此一旦浏览器升级换代，检测方法可能就失效了。

## 使用platform库 ##

[platform][]是一个检测浏览器和操作系统版本的JavaScript库。这里是它的Github地址：[https://github.com/bestiejs/platform.js][platform] 。将它添加到自己的项目中也非常容易，下载项目中的platform.js文件然后添加到自己的项目中，然后在html文件中添加`<script src="platform.js"></script>`即可。

我电脑是Windows10 64位操作系统，使用的是Chrome 50 64位浏览器。一下是platform.js在我浏览器上的运行结果。你也可以将platform.js导入到自己的网页中，然后在F12开发者模式中在控制台中查看结果。

#### platform ####

返回一个浏览器平台对象，包含以下的各种属性

> Object \{description: “Chrome 50.0.2661.102 on Windows NT 10.0 64-bit”, layout: “Blink”, manufacturer: null, name: “Chrome”, prerelease: null…\}  
> description:”Chrome 50.0.2661.102 on Windows NT 10.0 64-bit”  
> layout:”Blink”  
> manufacturer:null  
> name:”Chrome”  
> os:Object  
> parse:parse(ua)  
> prerelease:null  
> product:null  
> toString:toStringPlatform()  
> ua:”Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.102 Safari/537.36”  
> version:”50.0.2661.102”  
> **proto**:Object

#### platform.description ####

浏览器平台描述

> Chrome 50.0.2661.102 on Windows NT 10.0 64-bit

#### platform.layout ####

浏览器布局引擎名称

> Blink

#### platform.manufacturer ####

产品的制造商

> null

#### platform.name ####

浏览器名称

> Chrome