在前端开发的工作中,我们总是有些数据需要统计,比如统计当前客户的浏览器分布,操作系统分布或者在前端音视频的兼容性处理中,总是有些特殊的浏览器需要一些特别的处理。所以难免需要区分浏览器类型和版本之类的工作,索性就自己开发一个浏览器工具类方便使用,可以直接通过npm引用
npm i web-browser-utils
或者直接上源码: github
浏览器信息
支持获取浏览器类型
BrowserUtil.browserName
目前支持的浏览器类型包括
enum BrowserName {
IE = "IE",
Chrome = 'Chrome',
Safari = 'Safari',
Firefox = 'Firefox',
Opera = 'Opera',
Edge = "Edge",
MicroMessenger = 'MicroMessenger',
Quark = "Quark",
QQ = 'QQ',
QQBrowser = 'QQBrowser',
DingTalk = 'DingTalk',
Electron = 'Electron',
Sogou = "Sogou",
Vivo = "VivoBrowser",
Oppo = "OppoBrowser",
UC = "UCBrowser",
MI = "MiBrowser",
Huawei = 'Huawei',
Finger = 'Finger',
Lenovo = "SLBrowser", // 联想浏览器
Maxthon = "Maxthon", // 遨游浏览器
Liebao = "Liebao", // 猎豹浏览器
Meizu = "MZBrowser",
Unknown = 'unknown',
}
其中包括浏览器和一些常见的webview的情况也作了区分,比如QQ、微信、钉钉等。Unknown是部分无法识别的浏览器,大概率是默写修改了userAgent的场景。后面发现了也会不定期的更新这个列表。
支持获取浏览器版本
BrowserUtil.browserVersion
操作系统
支持获取操作系统类型
SystemUtil.systemName
目前支持的浏览器类型包括
/**
* 系统平台
*/
export enum SystemName {
Unknown = "Unknown",
MacOS = "Mac",
Windows = "Windows",
Windows10 = "Windows 10",
Windows7 = "Windows 7",
WindowsVista = "Windows vista",
WindowsXP = "Windows xp",
Android = "Android",
iPhone = "iPhone",
iPad = "iPad",
iOS = "iOS",
Linux = "Linux",
ChromeOS = "ChromeOS",
}
其中包括浏览器和一些常见的pc和移动端的操作系统。Unknown是部分无法识别的浏览器,这个后面也会不定期的更新修复Unknown的情况
支持获取浏览器版本
SystemUtil.systemVersion