Question

我遇到问题需要准确计算5分钟。在这个场景中，从服务器响应中我得到dateTime格式为YYYY-MM-DD HH:mm:ss之后我在页面上显示本地计时器，该计时器在该时间后计算5分钟。我是用momentjs做的。

＆＃13;

var output = document.getElementById('out');

var fromCount = '2017-02-22 00:23:50';
var toMins = moment(fromCount).add(5, 'minutes');
var toMinsCount = setInterval(function(){
  var now = moment();
  var diff = moment(toMins - now).format('mm:ss');
  if(diff==='00:00'){
    clearInterval(toMinsCount);
    // something more here
    output.innerText = 'times up change fromCount data time';
  }
  if(now>toMins){
    clearInterval(toMinsCount);
    output.innerText = 'change fromCount data time';
  } else {
    output.innerText = diff;
  }
},1000);

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js"></script>

<div id="out"></div>

＆＃13;

一切都很好但是有时当我添加5分钟到日期计数器从5:13开始计数或更高时，例如来自count = '2017-02-22 00:30:50'和now date = {{1 }}。那么我该如何避免这个问题并显示本地计数器的确切'2017-02-22 00:30:15'分钟？

我需要从服务器时间计算它，因为我的计数器取决于特殊事件。而且我应该从服务器捕获的那一刻开始为每个用户显示同一时间。以本地方式，每个用户将看到它自己的5分钟计时器。

Answer 1

服务器和客户端可能有不同的时间，它们不同步。每次服务器响应时计数限制为5分钟，或者从服务器发送倒计时限制，而不是服务器时间。

var limit = 5 * 60 // 5 minutes × 60 seconds
  , output = document.getElementById("theFinalCountdown")
  , interval = setInterval(function() {
      if (limit === 0) {
          clearInterval(interval);
      } else {
          output.textContent = // innerText is WRONG, use textContent
              moment.unix(limit).format("mm:ss");
      }
      limit--;
  }, 1000);

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.17.1/moment.min.js"></script>
<div id="theFinalCountdown"></div>

Answer 2

好的，这里的解决方案符合我的需求。

function count5min(value) {
    $http.get('https://testfate.ru/time').then(function (resp) {
      // getting dateTime fromServer

      var realTime, toMins, diff;

      realTime = moment(resp.data.time).valueOf();
      diff = moment().valueOf() - realTime;

      var beforeStart = moment(value);

      toMins = moment(beforeStart).add(5, 'minutes');

      var toMinsCount = setInterval(function () {
        var now = moment().subtract(diff, 'milliseconds');
        var difference = moment(toMins - now).format('mm:ss');
        if (difference === '00:00') {
          clearInterval(toMinsCount);
        }
        if (now > toMins) {
          clearInterval(toMinsCount);
        } else {
          $(el).find('.short-timer').text(difference);
        }
      }, 1000);

    }, function (err) {
      console.error(err);
    });
  }

所以我所做的是，从服务器获取时间，发现本地时间和服务器时间之间的差异，以毫秒为单位，然后在间隔函数中减去与本地时间的差异。对我来说就像一个魅力。我的朋友向我提出这个想法。

从日期开始计算5分钟

2 个答案: