在javascript中以良好的精度同步时间(>0.5s)(类似ntp)

Synchronize time in javascript with a good precision (>0.5s) (NTP-like)

本文关键字：5s ntp 类似 时间 javascript 同步 精度      更新时间：2023-09-26

我正在寻找一种方法来同步时间在客户端之间具有良好的精度(让我们说至少0.5秒)。

我排除使用json时间或利用时间戳在服务器响应头由于精度差(一秒或更少)。

更新:它甚至可以在移动连接下工作。3G连接本身的往返时间在0.5s左右的情况并不少见(例如在意大利)，因此算法必须是健壮的。

采用老式的ICMP时间戳消息方案。在JavaScript和PHP中实现它相当简单。

下面是使用JavaScript和PHP实现的方案:

// browser.js
var request = new XMLHttpRequest();
request.onreadystatechange = readystatechangehandler;
request.open("POST", "http://www.example.com/sync.php", true);
request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
request.send("original=" + (new Date).getTime());
function readystatechangehandler() {
    var returned = (new Date).getTime();
    if (request.readyState === 4 && request.status === 200) {
        var timestamp = request.responseText.split('|');
        var original = + timestamp[0];
        var receive = + timestamp[1];
        var transmit = + timestamp[2];
        var sending = receive - original;
        var receiving = returned - transmit;
        var roundtrip = sending + receiving;
        var oneway = roundtrip / 2;
        var difference = sending - oneway; // this is what you want
        // so the server time will be client time + difference
    }
}

现在对于sync.php代码:

<?php
    $receive = round(microtime(true) * 1000);
    echo $_POST["original"] . '|';
    echo $receive . '|';
    echo round(microtime(true) * 1000);
?>

我没有测试上面的代码，但它应该可以工作。

注意:如果实际发送和接收消息的时间相同或大致相同，下面的方法将准确计算客户端和服务器之间的时间差。考虑以下场景:

  Time    Client   Server
-------- -------- --------
Original        0        2
Receive         3        5
Transmit        4        6
Returned        7        9
  1. 正如您所看到的，客户端和服务器时钟是2个单位不同步。因此当客户端发送时间戳请求时，它将原始时间记录为0。
  2. 服务器延迟3个单位接收请求，但记录接收时间为5个单位，因为它提前了2个单位。
  3. 则延迟1个单位发送时间戳应答，记录发送时间为6个单位。
  4. 客户端在3个单位后收到回复(即服务器在9个单位)。但是，由于它比服务器慢2个单位，因此它将返回的时间记录为7个单位。

使用这些数据，我们可以计算:

Sending = Receive - Original = 5 - 0 = 5
Receiving = Returned - Transmit = 7 - 6 = 1
Roundtrip = Sending + Receiving = 5 + 1 = 6

从上面可以看到，发送和接收时间的计算不正确，这取决于客户端和服务器偏离同步的程度。然而，往返时间总是正确的，因为我们首先添加两个单位(接收+原始)，然后减去两个单位(返回-发送)。

如果我们假设单向时间总是往返时间的一半(即发送时间是接收时间，那么我们可以很容易地计算时差，如下所示):

Oneway = Roundtrip / 2 = 6 / 2 = 3
Difference = Sending - Oneway = 5 - 3 = 2

如你所见，我们精确地计算出时差为2个单位。时差方程总是sending - oneway时间。然而，这个方程的准确性取决于您计算单向时间的准确性。如果发送和接收消息的实际时间不相等或近似相等，则需要找到其他方法来计算单向时间。但是，对于您的目的，这应该足够了。

如果您只想同步多台计算机上的时间时钟，NTP本身建议您设置自己的时间服务器。

<标题>服务器端点h1> 服务器上设置api端点例如
http://localhost:3000/api/time

的回报:

status: 200, 
body: { time: {{currentTime}} }

这取决于你使用的后端语言。

<标题>客户端代码

给定这样一个端点，我拼凑的这个JS片段将

  1. 轮询服务器端点10次。
  2. 尝试通过删除一半的往返时间来补偿延迟。
  3. 报告服务器和客户端之间的平均偏移量

var offsets = [];
var counter = 0;
var maxTimes = 10;
var beforeTime = null;
// get average 
var mean = function(array) {
  var sum = 0;
  
  array.forEach(function (value) {
    sum += value;
  });
  
  return sum/array.length;
}
var getTimeDiff = function() {
  beforeTime = Date.now();
  $.ajax('/api/time', {
      type: 'GET',
      success: function(response) {
          var now, timeDiff, serverTime, offset;
          counter++;
          
          // Get offset
          now = Date.now();
          timeDiff = (now-beforeTime)/2;
          serverTime = response.data.time-timeDiff;
          offset = now-serverTime;
          
          console.log(offset);
          
          // Push to array
          offsets.push(offset)
          if (counter < maxTimes) {
            // Repeat
            getTimeDiff();
          } else {
            var averageOffset = mean(offsets);
            console.log("average offset:" + averageOffset);
          }
      }
  });
}
// populate 'offsets' array and return average offsets
getTimeDiff();

您可以使用此计算偏移量(只需将其添加到本地时间)，从每个客户端上下文中确定一个通用的"通用"时间。

相关文章：