前端获取网络时间的方法

使用场景：前端根据配置在 一个时间段内展示一个入口，直接通过 new Date() 获取的是本地时间，如果本地机器时间更改，该时间是不正确的，需要使用网络时间。

解决办法：
通过发xhr一个请求，从返回值中获取服务器时间。

getNetTime.js

// getNetTime.js

export function getNowTime() {
    return new Promise((resolve) => {
      const xhr = new window.XMLHttpRequest;
      xhr.responseType = "document";
      // 通过get的方式请求当前文件
      xhr.open("head", location.href);
      xhr.send(null);
      // 监听请求状态变化
      xhr.onreadystatechange = function () {
        var time = null;
        if (xhr.readyState === 2) {
          // 获取响应头里的时间戳
          time = xhr.getResponseHeader("Date");
          time = time ? new Date(time) : new Date();
          resolve(time);
        }
      };
  
      setTimeout(function () {
        resolve(new Date());
      }, 2000);
    });
}

使用：

use.vue

import {getNowTime} from "./getNetTime";

getNowTime().then(now => {
    console.log(now); // now.getTime()
})

// Wed, 21 Apr 2021 03:10:31 GMT