- 这并没有帮助-How can I make setInterval also work when a tab is inactive in Chrome?实际上,我下面的代码非常相似... *
**目的:**我需要花25分钟(15.000秒)倒计时到0。
**问题:**它在Mac上的非活动选项卡中不起作用。它会在一段时间后减慢甚至完全停止。
我尝试了不同的选项: - 将逻辑移动到Worker(单独的worker.js文件)
- 在函数中使用了started Date和当前Date之间的差值
- 使用此库https://github.com/turuslan/HackTimer
- 还有很多不同的代码变体
没有任何帮助。。
My worker.js:
let timerId;
self.onmessage = function(evt) {
if (evt.data.command === 'start' || evt.data.command === 'stop') {
clearInterval(timerId);
}
if (evt.data.command === "start") {
let seconds = evt.data.value;
timerId = setInterval(function() {
seconds--;
let currentSeconds = parseInt(Date.now() / 1000, 10);
let secondsLeft = evt.data.finishedAt - currentSeconds;
console.log(secondsLeft, seconds);
if (secondsLeft !== seconds) {
seconds = secondsLeft;
}
self.postMessage(seconds);
}, 1000);
}
};
但这种逻辑并没有帮助:
if (secondsLeft !== seconds) {
seconds = secondsLeft;
}
如何使用我的员工:
let startedAt = parseInt(Date.now() / 1000, 10);
let finishedAt = startedAt + v.currentState.timer.value;
v.currentState.worker.postMessage({
'command': 'start',
'value': v.currentState.timer.value,
'startedAt': startedAt,
'finishedAt': finishedAt
});
v.currentState.worker.onmessage = function(e) {
v.currentState.timer.value = e.data;
};
1条答案
按热度按时间tmb3ates1#
How can I make setInterval also work when a tab is inactive in Chrome?的最佳答案实际上也是您的答案。您需要注意倒计时开始的时间戳(通过Date),然后仅在浏览器选项卡处于活动状态时使用
window.onfocus
和window.onblur
设置时间间隔(当选项卡失去焦点时清除时间间隔)。显示的倒计时可以从开始时间计算。只要在选项卡未激活时完全不依赖setInterval即可。