setIntervalメソッドで現在時刻を更新し続ける件について

ブラウザー上で現在時刻を2017-01-01 12:00:15みたいに秒まで表示し、setIntervalメソッドでその時刻表示を更新し続けたいです。

クライアント側の時刻を起点にしてしまうとクライアントのマシーンに設定されてる時刻が起点になってしまうので、最初はサーバー側で設定される時刻を取得して、その時刻を起点に現在時刻を更新して行こうと考えています。

そこで懸念点なのですが、setIntervalってどのくらい正確なものなのでしょうか？

1日、現在時刻の更新タイマーを放置していたとしても、ちゃんと秒まで誤差なく、現在時刻を更新してくれるものなのでしょうか？

誤差が生まれてしまう場合は、定期的にクライアント側からサーバー側の時刻を取得してあげるか、サーバー側からクライアント側にウェブソケットで現在時刻を送ってあげたりなどの対策でokでしょうか？

行動規範の内容に同意します

回答2件

ベストアンサー

setIntervalの精度もそうですが、サーバー時間を参照するということは
httpでよみこむ時間差が発生するので、コンマ秒単位の正確さは
保証は難しいようです。

タイマーの間隔を気にするのであれば、
最初にサーバー時間とユーザー時計の差をとっておいて、
つねにユーザー時計との差を利用して時間を表示する考え方もあります
ただし差を計算する間に時間がすぎていますので、結局微妙な
誤差は吸収しきれませんが１秒単位でずれることはないでしょう。

ただしその方式だとユーザーが時計をいじってしまったり
タイムサーバーとの同期で調整がはいってしまうと根拠がくずれますので
適当なタイミングで同期をとるなど運用でカバーが必要です

投稿2017/07/14 00:30

yambejp

総合スコア117413

退会済みユーザー

2017/07/14 02:10

御回答ありがとうございます。時刻表示機能は簡単そうで、やはり、一癖あるのですね。確認できて良かったです！ありがとうございました！

行動規範の内容に同意します

setIntervalの精度は信頼できないので、時刻表示と時刻取得を非同期に動かすなどが考えられます。

エラー処理とか誤差とか考えられてないです。
誤差についてはローカルと比較する、複数サーバから取得して平均するなど考えられます。

javascript
1var Time;
2var LoopTimer;
3var GetTimer;
4function start() 
5{
6  LoopTimer = setInterval("printtime()", 100);
7  gettime();
8}
9function gettime()
10{
11  // サーバから時刻取得
12  
13  // タイムアウト
14  GetTimer = setInterval("timeout()", 1000);
15}
16// レスポンス受信処理
17function getresponse() {
18  // タイマークリア
19  clearInterval(GetTimer);
20  // 取得した時刻を変数に格納
21  Time = responseText;
22  // 再度取得
23  gettime();
24}
25// タイムアウト処理
26function timeout() {
27  // タイマークリア
28  clearInterval(GetTimer);
29  // サーバ切断 abort();
30  
31  // 再度取得
32  gettime();
33}
34// 時刻表示
35function printtime() {
36  // 表示置き換え
37
38}