收到客户反馈收银台因采用本地时间，导致倒计时不准确，当本地时间较快时，收银台计时器会提前到达订单有效期，导致收银台订单无法正常支付。于是开始思考客户端倒计时究竟应如何做到最佳实践。

直接采用本地时间

直接采用本地时间无疑是有问题，但是这里也先进行讨论一下，为什么会出现问题。

最初接触代码的时候的，可能写的最简单的倒计时就是直接通过 setInterval 和 setTimeout 进行了，例如下面的代码

let expiredDate = Date.parse("2021-12-12 12:12:12");
setInterval(function () {
	let salvagedDate = expiredDate - new Date().getTime();
	let minute = salvagedDate / 1000 / 60;
	let second = salvagedDate / 1000 % 60;
	console.log("剩余支付时间 : %d 分  %d 秒", minute, second)
}, 1000);

如果客户端时间是完全没用问题的，那么这个代码并不会出现什么严重问题，但是当客户端对时间进行调整，会发现时间回拨或者向前跳跃。于是，我们可以采用服务器时间进行到期时间计算。

采用服务器时间

我们可以直接改动上面的代码，通过接口获取服务器时间，替换new Date().getTime() 这种本地时间获取方式，但是再调用服务器接口的时候，网络请求是根据网络情况进行波动的，特别当网络状况极差时，甚至出现倒计时直接卡顿无法正确执行或则出现先执行的代码后拿到结果导致倒计时回拨。

于是，我们可以对此进行改进，通过采用差额处理，来矫正客户端时间，通过一段时间的刷新服务器时间，计算时间差额，将差额参与倒计时的计算中，而不直接采用每次都依赖服务端时间来进行计算，避免过于依赖网络。

let expiredDate = Date.parse("2021-12-12 12:12:12");
var timeBalance = 0;
getTimeBalance(); //应当首先初始化时间差额，此处并不能保证，AJAX 为异步执行

setInterval(function (){
	getTimeBalance();
}, 10000);

setInterval(function () {
	let salvagedDate = expiredDate - (new Date().getTime() - timeBalance);
	let minute = salvagedDate / 1000 / 60;
	let second = salvagedDate / 1000 % 60
	console.log("剩余支付时间 : %d 分  %d 秒", minute, second)
}, 1000);

function getTimeBalance() {
	$.ajax({
		type: "POST",
		url: "/rest/v1/timestamp",
		dataType: "json",
		success: function (data) {
			let currentTimestamp = new Date().getTime();
			let serverTimestamp = data.timestamp;
			timeBalance = currentTimestamp - serverTimestamp;
		}
	})
}

服务器时间核对

上面解决了客户端时间未和服务端时间同步的问题，但是还有一个问题，如何保证服务端的时间是准确的。

NTP 服务

我们可以通过 NTP 服务对服务器时间进行矫正，NTP (Network Time Protocol) 是用来使计算机时间同步化的一种协议，它可以使计算机以较高精准度的时间校准（LAN上与标准间差小于1毫秒，WAN上几十毫秒，对其服务器或时钟源做同步化。

国内可以采用的 AliYun 的 ntp.cloud.aliyuncs.com 服务并搭配定时任务进行同步时间 。

crontab -e //打开编辑器
0 2 */1 * * ntpdate ntp.aliyun.com // 添加任务，每天凌晨两点执行