前言

看到標(biāo)題，大家就能想起這個(gè)需求在很多項(xiàng)目上都能用到。我們部署在Web服務(wù)器上的前端應(yīng)用，既可以用PC瀏覽器訪問，也可以用手機(jī)瀏覽器訪問，再加上現(xiàn)在智能設(shè)備的推廣，我們甚至能在車載系統(tǒng)、穿戴設(shè)備和電視平臺(tái)上訪問。

設(shè)備的多樣化讓用戶無處不在，有時(shí)候我們需要根據(jù)不同的瀏覽器運(yùn)行環(huán)境做出對(duì)應(yīng)的處理。瀏覽器是JavaScript的承載體，我們可以從瀏覽器上獲取相關(guān)的信息，來進(jìn)一步處理我們的業(yè)務(wù)邏輯。

然而瀏覽器品牌眾多，有些瀏覽器使用的標(biāo)準(zhǔn)也不太一樣，造就了難以統(tǒng)一的判斷。下面我大概羅列一下常用的瀏覽器品牌和在什么情況下使用瀏覽器運(yùn)行環(huán)境判斷。瀏覽器相關(guān)統(tǒng)計(jì)數(shù)據(jù)可以參考這里。

國際五大瀏覽器品牌：按照全球使用率降序排列

國產(chǎn)常用瀏覽器品牌：按照國內(nèi)使用率降序排列，普遍基于開源項(xiàng)目Chromium進(jìn)行開發(fā)

順便吐槽一下這個(gè)不要臉的紅芯瀏覽器，明明就是基于Chromium進(jìn)行二次開發(fā)再套多一層外殼，還非得說自己開發(fā)的瀏覽器是世界第五大瀏覽器，偷吃不抹嘴，還是被眼尖的網(wǎng)友發(fā)現(xiàn)了。。。。

使用場景

原理

針對(duì)處理一個(gè)這樣的使用場景，其實(shí)有一個(gè)比較專業(yè)的名字，叫做瀏覽器指紋。我們上面談到的需求也只是瀏覽器指紋方案里面的一小部分，而我們需要使用到的瀏覽器指紋就是UserAgent。

這個(gè)UserAgent是何方神圣呢，中文翻譯過來就是用戶代理。引用百度的定義，就是一個(gè)特殊字符串頭，使得服務(wù)器能夠識(shí)別客戶使用的操作系統(tǒng)及版本、CPU類型、瀏覽器載體及版本、瀏覽器渲染引擎、瀏覽器語言、瀏覽器插件等。而這些信息也足夠我們?nèi)ヅ袛酁g覽器運(yùn)行環(huán)境了。

準(zhǔn)備

目前網(wǎng)上很多解決方法都只是針對(duì)系統(tǒng)是否是桌面端還是移動(dòng)端，Android端還是iOS端，部分瀏覽器載體的判斷和獲取等等，沒有一個(gè)比較完美或者終極的解決方案。