Code d'implémentation pour déterminer le type de réseau et l'état de la connexion grâce aux compétences JS_javascript

L'environnement du réseau mobile en Chine est complexe. Afin d'offrir aux utilisateurs une meilleure expérience d'accès, les développeurs espèrent comprendre la méthode de mise en réseau actuelle de l'utilisateur, puis fournir à l'utilisateur un résultat de demande qui correspond à l'environnement réseau actuel.

La spécification W3C fournit une méthode pour obtenir l'état actuel du réseau navigator.connection selon la spécification du protocole Working Draft du 29 novembre 2012, nous pouvons obtenir la bande passante (bande passante, M/s) et les paramètres mesurés à partir de la valeur de l'interface. ; il fournit également une méthode de surveillance pour surveiller les changements dans l'environnement d'accès à tout moment. En réalité, nous avons constaté que de nombreux navigateurs ne renvoyaient pas la valeur de la bande passante, se conformaient au protocole de travail du 7 juin 2011 et nous renvoyaient le type (type, wifi/2g/3g/4g).

Jetons un coup d'œil au soutien de chaque entreprise

Android 2.3 Browser	UC	Dolphin	QQ浏览器	Baidu	Firefox	Chrome	Opera Mini	Maxthon
Yes	No*	Yes	Yes*	Yes	Yes(New)	No	No	Yes

Les informations pertinentes ne peuvent être obtenues à partir d'aucun navigateur sur iPhone.

Grâce à la description ci-dessus, nous avons constaté que nous pouvons toujours comprendre l'état de la connexion Internet d'un grand nombre d'utilisateurs grâce à ce paramètre et leur offrir une meilleure expérience.
Ensuite, nous nous concentrons sur l'état de retour de chaque navigateur.

La plupart des navigateurs renvoient un type int. Un cas particulier est le navigateur QQ, qui renvoie le nom du type. La relation correspondante est la suivante

.

返回值	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

Le suivant est un cas particulier plus important, c'est Firefox, il utilise la nouvelle version de la spécification, donc il renvoie de la bande passante ; mais ce qui est très étrange c'est que tant que c'est du wifi ou de la 3G, il renvoie 20, et s'il s'agit de 2G, il renvoie 0,1953125 ; c'est la même chose à chaque fois, quel que soit l'état actuel du réseau. Cette question continuera à faire l'objet d'un suivi.

Vous fournir une adresse de démonstration : http://demo.jb51.net/js/2015/net.html
Dans la démo, {type:0} est directement renvoyé aux navigateurs qui ne prennent pas en charge la connexion, ce qui résout commodément le problème que certains navigateurs ne le prennent pas en charge. Il est également approprié de traiter les navigateurs qui ne prennent pas en charge la connexion et peuvent accéder à Internet. comme « inconnu ».

De nombreux ingénieurs estiment que la prise en charge de cette fonction n'est pas assez bonne et qu'il est préférable de ne pas l'utiliser pour l'instant ; mais je pense que tant que les erreurs peuvent être gérées et les risques peuvent être contrôlés, pourquoi ne pas offrir une expérience plus conviviale ; à ces clients qui sont intrinsèquement bons.

Aujourd'hui, mon camarade de classe a parlé de laisser le backend juger de la vitesse. Cela peut être un peu difficile, mais il est en effet possible d'obtenir la vitesse approximative de l'utilisateur à travers chaque requête asynchrone (le temps de chargement et la taille du fichier peuvent en fait être variables). obtenu par le frontend), puis sélectionnez Fournir certains services d'une manière orientée vers le sexe, et prévoyez de réfléchir davantage dans cette direction à l'avenir.