2013-01-08 40 views
11

使用Meteor,在显示服务器时间的客户端上保持运行时钟(h:m:s)的有效方法是什么?在Meteor的客户端显示服务器时间

我发现的JavaScript/PHP答案通常涉及定期获取服务器时间并计算它与客户端之间的差异。

流星会出现什么样子?

更新:自我最初发布此问题以来,发生了很大变化。如果您对预先构建的解决方案感兴趣,我建议您通过@mizzao查看Meteor Timesync。通过在控制台中运行meteor add mizzao:timesync来安装它。

回答

21

大卫格林斯潘大约14:30在presentation on Spark得到客户端时间。我稍微修改这个代码来获得服务器端时间:

的Javascript:

if (Meteor.isClient) { 
    Meteor.startup(function() { 
     setInterval(function() { 
      Meteor.call("getServerTime", function (error, result) { 
       Session.set("time", result); 
      }); 
     }, 1000); 
    }); 

    Template.main.time = function() { 
     return Session.get("time"); 
    }; 
} 

if (Meteor.isServer) { 
    Meteor.methods({ 
     getServerTime: function() { 
      var _time = (new Date).toTimeString(); 
      console.log(_time); 
      return _time; 
     } 
    }); 
} 

和HTML:

<body> 
    {{> main}} 
</body> 

<template name="main"> 
    {{time}} 
</template> 
+0

此代码显示客户端的时间,而不是服务器的时间。 –

+0

Sheesh。你是对的。我修改了他的代码并编辑了我的答案。 – TimDog

+0

为什么downvote?我已经测试了这个代码,它的工作原理。 – TimDog

6

感谢@TimDog的帮助。我已经扩展了这些代码,只在客户机上仍然显示运行时钟的情况下定期检查服务器。这是我结束了:

客户端代码:

Meteor.startup(function() { 

    function setServerTime(){ 

     //get server time (it's in milliseconds) 
     Meteor.call("getServerTime", function (error, result) { 

     //get client time in milliseconds 
     localTime = new Date().getTime(); 

     //difference between server and client 
     var serverOffset = result - localTime; 

     //store difference in the session 
     Session.set("serverTimeOffset", serverOffset); 

     }); 
    } 

    function setDisplayTime(){ 
     var offset = Session.get("serverTimeOffset"); 
     var adjustedLocal = new Date().getTime() + offset; 
     Session.set("serverTime", adjustedLocal); 
    } 

    //run these once on client start so we don't have to wait for setInterval 
    setServerTime(); 
    setDisplayTime(); 

    //check server time every 15min 
    setInterval(function updateServerTime() { 
     setServerTime(); 
    }, 900000); 

    //update clock on screen every second 
    setInterval(function updateDisplayTime() { 
     setDisplayTime(); 
    }, 1000); 

    }); 

    //pass the clock to the HTML template 
    Template.register.clock = function() { 
    return new Date(Session.get("serverTime")); 
    }; 

Server代码:

Meteor.methods({ 

    //get server time in milliseconds 
    getServerTime: function() { 
     var _time = (new Date).getTime(); 
     console.log(_time); 
     return _time; 
    } 

    }); 
0

由于在这个问题上的随访,这是一个性能负担?我们正在计算每秒的偏移量,并根据此重新计算更改会话。

这是否意味着其他依赖Session的东西也会每秒重新计算一次?

可能更好地设置其他东西?

或者简单地做一个方法,根据需要进行本地日期调整,设置间隔和会话变量。

让我知道你找到了什么。

+0

你的实现在这里,对吧? (https://gist.github.com/zeroasterisk/7018221)。我认为客户不需要频繁地计算偏移量就可以,但是由于存在一种反应式服务器时间方法,它会根据偏移量重新计算每秒。这将允许实时滴答出现在客户端应用程序上。我会考虑把它变成一个聪明的软件包。 –

8

关于此主题有非常不错的资讯。我拉到一起的一切到智能包流星:

https://github.com/mizzao/meteor-timesync

有我加超过两个主要的事情是什么已经在这里:

  • 的更精确的计算服务器/客户端偏移量使用NTP风格的数学运算,而不仅仅是区分客户端和服务器时间,而忽略往返时间。
  • 能够反应性地使用服务器时间戳来显示将在模板和反应式计算中自行更新的值。

如果您有更好/更有效的计算和维护偏移方法的想法,请随时在此处打开拉取请求。

+0

太棒了,我会检查出来的。 –

相关问题