通過JS判斷聯網類型和連接狀態


通過JS判斷聯網類型和連接狀態

 

通過JS判斷聯網類型和連接狀態

中國的移動網絡環境復雜,為了給用戶帶去更好訪問體驗,開發者希望能了解用戶當前的聯網方式,然后給用戶一個符合當前網絡環境的請求結果。

W3C的規范中給出了一個方法來獲得現在的網絡狀態navigator.connection;根據Working Draft 29 November 2012協議規范我們可以從接口中獲得bandwidth(帶寬,M/s)和metered兩個參數的值;還提供了一個監聽方法,來時刻監聽接入環境的變化情況。現實中我們發現很多瀏覽器並沒有返回bandwidth值,而且遵守了Working Draft 07 June 2011的協議返回給我們type(類型,wifi/2g/3g/4g)。

我們接下來就看看各家的支持情況

Android 2.3+ Browser UC Dolphin QQ瀏覽器 Baidu Firefox Chrome Opera Mini Maxthon
Yes No* Yes Yes* Yes Yes(New) No No Yes

說明下在iPhone中任何瀏覽器都無法得到相關信息。

通過上面的說明,我們發現還是可以通過這個參數了解很大一部分用戶的聯網情況的,並且為他們提供更加優質的體驗。 接下來我們重點說說各瀏覽器的返回情況。

大部分瀏覽器會返回一個int型的類型,其中的特例是QQ瀏覽器,返回的就是類型名稱,對應關系如下

返回值 QQ返回值 類型
0 unknown UNKNOWN
1 ethernet ETHERNET
2 wifi WIFI
3 2g CELL_2G
4 3g CELL_3G
5 4g CELL_4G(中國現在也會出現這個值,是hspa+)
? none NONE

接下去是一個更大的特例,這就是firefox,他使用了新版規范,所以返回的是bandwidth;不過很奇怪的是只要是wifi或3G他就返回20,如果是2G返回的就是0.1953125;每次都一樣不管現在網絡狀態到底是多少。這個問題還會繼續跟進。

給大家提供一個demo地址:http://honglei.net/demo/net.html

Demo中對不支持connection的瀏覽器直接返回了{type:0},這樣就很便利解決了某些瀏覽器不支持的問題;對於不支持又能上網的瀏覽器處理為“unknown”當然也是合乎情理的。

很多工程師覺得這個功能支持還不好,還是先不使用的好;但是我覺得只要錯誤能被處理,風險能被把控,為什么不給那些先天優秀的客戶提供更友好的體驗呢。

今天同學說到讓后端判斷速度,這個可能有點難;不過確實可以通過每次的異步請求去得到用戶大概的速度(加載的時間和文件大小其實前端都能得到),然后在選擇性的提供某些服務,之后也准備向這個方向上多思考下。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM