Web中的网络问题

发布网友发布时间：2023-04-13 22:00

共1个回答

热心网友时间：2023-11-01 10:13

navigator.onLine 用于检测浏览器是否连网， true/false ；
navigator.connection 用于检测网络状况；

通过 navigator.connection 可以判断出 online，fast 3g，slow 3g，和 offline ，这四种状态下的 effectiveType 分别为 4g，3g，2g，slow-2g（rtt，downlink均为0）。

rtt 和 downlink 反映网络状况，比 effectiveType 更加具象且更能反映当前网络的真实情况。
常见网络情况：

注意：rtt 和 downlink 不是定值，而是实时变化的。 online 时，可能它现在是 rtt 100ms，2.2Mb/s ，下一秒就变成 125ms，2.1Mb/s了。
rtt：连接预估往返时间，单位 ms ，值为四舍五入到 25ms 的最接近倍数（x%25 === 0），值越小网速就越快。在 Web Worker 中可用；
downlink：带宽预估值，单位 Mbit/s(注意是Mbit，不是MByte) ，值也是四舍五入到最接近 25bit/s 的倍数。一般带宽速度越快，信道上可以传输更多数。值越大网速越快。在 Web Worker 中可用。

草案（Draft）阶段 NetworkInformation API
无论是 rtt ，还是 downlink ，都是这个草案中的内容。除此之外还有 downlinkMax，saveData，type 等属性。所以要注意兼容问题。
NetworkInformation 继承自 EventTarget ，可以通过监听 change 事件去做一些响应。