javascript - 如何在网络中只运行一个定时器

Question

我想每秒钟增加 1 秒。我需要将 localStorage 用于其他目的...所以，我放了一个 setInterval 并每秒递增到 localStorage

但问题是，如果我在两个选项卡中打开同一个页面，秒数会增加 2 倍。

我想一次只运行一个增量。我该怎么做...

这是我目前的尝试

这是我必须增加时间的代码

this.timer = setInterval(() => {
localStorage.setItem('currentTime',String(currentTime));
});

** 注意:**

我明白我可以只拥有一个局部变量并在 UI 中显示这一点，但我想存储在 localStorage 中用于其他目的。

要替换 setInterval，我也准备更改 Observable.interval，比如

import {Observable} from 'rxjs/Rx';
  Observable.interval(1000).subscribe(x => {
    localStorage.setItem('currentTime',String(currentTime));
  });

但是它不会做任何事情来检查任何现有的增量器是否正在运行。我该怎么做

Answer 1

如果上次保存时间与新保存时间之间的差异不等于您的间隔时间，您可以设法不将时间保存到本地存储中:

this.timer = setInterval(() => {
    var currentTime = new Date();
    var lastTime = localStorage.getItem('currentTime');
    if (lastTime) {
        var lastTimeTimestamp = new Date(lastTime).getTime();
        var currentTimeTimestamp = currentTime.getTime();
        if (currentTimeTimestamp - lastTimeTimestamp >= 1000) {
            localStorage.setItem('currentTime',String(currentTime));
        }
    } else {
        localStorage.setItem('currentTime',String(currentTime));
    }

}, 1000);