JS_javascript スキルを通じてネットワーク タイプと接続ステータスを判断する実装コード

中国のモバイル ネットワーク環境は複雑で、ユーザーにより良いアクセス エクスペリエンスを提供するために、開発者はユーザーの現在のネットワーク方法を理解し、現在のネットワーク環境に一致するリクエスト結果をユーザーに提供したいと考えています。

W3C 仕様では、2012 年 11 月 29 日のプロトコル仕様草案に従って、現在のネットワーク ステータスを取得する方法が提供されており、インターフェイス値から帯域幅 (帯域幅、M/s) と測定パラメータを取得できます。 ; アクセス環境の変化を常に監視する監視方法も提供します。実際には、多くのブラウザが帯域幅の値を返さず、2011 年 6 月 7 日の作業草案プロトコルに準拠し、タイプ (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 で、新しいバージョンの仕様を使用しているため、帯域幅を返しますが、非常に奇妙なのは、Wi-Fi または 3G である限り、20 を返すことです。 2G の場合は 0.1953125 を返します。現在のネットワークの状態に関係なく、毎回同じです。この問題は引き続き追跡調査されます。

デモのアドレスを提供します: http://demo.jb51.net/js/2015/net.html
デモでは、接続をサポートしていないブラウザには {type:0} が直接返されるため、一部のブラウザがサポートしていないという問題は都合よく解決されます。また、接続をサポートせず、インターネットにアクセスできるブラウザを扱うことも適切です。 「不明」として。

多くのエンジニアは、この機能のサポートが不十分であり、まだ使用しない方がよいと感じていますが、エラーを処理でき、リスクを制御できるのであれば、もっとフレンドリーなエクスペリエンスを提供してもよいのではないかと考えています。本質的に良い顧客に。

今日、私のクラスメートは、バックエンドに速度を判断させることについて話しました。これは少し難しいかもしれませんが、各非同期リクエストを通じてユーザーのおおよその速度を取得することは実際に可能です。フロントエンドによって取得されます)、次に [特定のサービスを性指向の方法で提供する] を選択し、将来的にはこの方向でさらに検討する予定です。