Network Information API - 提供有关系统网络连接的信息

这是一个实验中的功能
此功能某些浏览器尚在开发中，请参考浏览器兼容性表格以得到在不同浏览器中适合使用的前缀。由于该功能对应的标准文档可能被重新修订，所以在未来版本的浏览器中该功能的语法和行为可能随之改变。

Network Information API（网络信息 API）根据一般连接类型（例如，“wifi”、“蜂窝” 等）提供有关系统网络连接的信息。它可用于根据用户的连接选择高清内容或低清晰度内容。整个 API 包括添加 NetworkInformation 接口和 Navigator 接口的 Navigator.connection 属性。

注意： 此特性在 Web Worker 中可用。

实例

检测连接变化

此实例监视用户连接的变化。

var connection = navigator.connection || navigator.mozConnection || navigator.webkitConnection;
var type = connection.effectiveType;

function updateConnectionStatus() {
  console.log("连接类型由 " + type + " 改为 " + connection.effectiveType);
  type = connection.effectiveType;
}

connection.addEventListener('change', updateConnectionStatus);

预加载大资源

连接对象对于决定是否预加载占用大量带宽或内存的资源很有用。此实例将在页面加载后立即调用，以检查可能不需要预加载视频的连接类型。如果找到蜂窝连接，则 preloadVideo 标志设置为 false。为简单起见，本示例仅测试一种连接类型。实际用例可能会使用 switch 语句或其他一些方法来检查 NetworkInformation.type 的所有可能值。无论 preloadVideo 值是多少，您都可以通过 NetworkInformation.effectiveType 属性来估计连接速度。

let preloadVideo = true;
var connection = navigator.connection || navigator.mozConnection || navigator.webkitConnection;
if (connection) {
  if (connection.effectiveType === 'slow-2g') {
    preloadVideo = false;
  }
}

接口