非常全面的瀏覽器useragent判斷代碼

來源:互聯網
上載者:User

什麼是User Agent?懂一點網頁製作的人應該都明白。簡單的說,User Agent就是用來識別瀏覽器名稱、版本、引擎以及作業系統等資訊的內容。於是乎,User Agent的判斷就成為識別瀏覽器的關鍵,不僅僅如此,移動互連網開發勢頭迅猛,那麼通過User Agent判斷案頭端裝置或行動裝置就變的很為重要。當然,通過User Agent也可以用來改善一定的相容性,比如判斷得到使用者用IE6瀏覽器那麼就是用不同的代碼。這些,我想許多的WEB開發中已經成為考慮的第一個問題。

那麼,有沒有一種好的判斷User Agent的代碼呢?網上應該有很多,比較簡單的直接判斷下iOS和Android,然後進入不一樣的頁面。比如百度地圖就是如此,電腦裝置訪問http://map.baidu.com/地址,而行動裝置就訪問http://map.baidu.com/mobile/地址,你用電腦裝置訪問移動網址則還會自動跳回到案頭地址。這就是通過判斷User Agent做到的效果。

我沒有去細究百度地圖是如何判斷電腦裝置和行動裝置的,但我想要找到一個比較全面的User Agent判斷代碼。不知道大家是否知道有一個叫html5test的網站,其中要作用就是判斷你的瀏覽器對HTML5的支援程度,但同時,他還提供了瀏覽器和裝置資訊。我在案頭端通過Firefox、Chrome、IE、Safari等測試都很正確,在行動裝置端,Apple iPod下測試了Safari、Opera mini和UC,除了UC無法識別外其他都OK,另外在Nokia E63下也做了測試,預設瀏覽器OK,UC無法識別。

既然HTML5TEST已經做的如此全面,連瀏覽器、引擎、裝置類型和裝置名稱等都一應俱全,那就說明在User Agent上的判斷應該是做的非常不錯的,至少,是我現今看到的最好的了。然後又看到HTML5TEST本身是開源的,那就下載下來分析一下吧。看過後,沒有想到,HTML5TEST竟然封裝的那麼好,一個JS包含了基本上全部的User Agent判斷,這個js檔案,可以直接瀏覽這裡。

我把這個JS單獨拿出來,再加上幾句html,做了個瀏覽器測試的頁面,大家可以通過訪問這個頁面來查看自己的瀏覽器資訊、裝置資訊等,效果請見。地址:http://rovertang.com/labs/useragent/

我想,通過這一個js,得到了瀏覽器資訊、裝置類型和裝置名稱,接下來怎麼做就看你自己的了,不過也有一個小小的擔心:一個大於50K的js檔案,對頁面的載入似乎是有點壓力的。

順便說一下,發現IE對HTML5的DOCTYPE標籤支援不是很好,有測試不通過的現象。萬惡的IE確實挺讓人惱火的。

最後推薦一個FireFox的組件吧,我想許多人都用過,就是User Agent Switcher,作用呢就是在FF下偽裝成其他瀏覽器,比如iPhone的瀏覽器,這樣就可以直接在FF下瀏覽移動網頁進行程式碼分析了。

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.