在 iOS8 上,如果该 web 应用程序处于事件状态并从主屏幕图标启动,则该 HTML5 网络应用程序不会在屏幕锁定后恢复 js 计时器然后解锁。在 iOS7 上,计时器会在这种情况下继续。我需要在屏幕解锁后继续计时 - 有什么技巧可以实现吗?
注意/请先通过共享按钮使用 Safari 的“添加到主屏幕”将网络应用程序添加到主屏幕。在 Safari 中运行页面不会导致上述问题。
<html>
<head>
<meta name="apple-mobile-web-app-capable" content="yes" />
<title>Test</title>
<script>
var tim;
function go() {
tim = window.setInterval(action, 1000);
}
function action() {
document.getElementById('x').innerHTML = new Date().getTime().toString();
}
</script>
</head>
<body onload="go()">
<div id="x"></div>
</body>
</html>
最佳答案
我们最终的解决方案并没有解决 IOS8 sleep 模式后所有损坏的功能,而只是 ajax requests/setTimeout/setInterval/requestAnimationFrame 和它们各自的清晰功能。
sleep 模式后出现的其他问题:
- -webkit-transition opacity 导致不可选择的区域
- 在键盘打开时调用的 worker.postMessage 会永久杀死所有 WebWorker
- 窗口弹跳/平移可以杀死所有 WebWorker。
- overflowchange/resize 事件不再有效。您需要重新设计任何依赖于它们的逻辑。
制作一个半可行的解决方案:
- 覆盖 setTimeout/setInterval/requestAnimationFrame/clearInterval/clearTimeout/cancelAnimationFrame。所有这些功能都需要将 postMessage 发送给 webworker,webworker 将相应地执行 setTimeout/setInterval。您可能还需要为这些功能设置暂停机制,但我并不是 100% 有必要。
- 重写 XMLHttpRequest,以便在调用 send 时,请求实际上是在 webworker 上执行的。
- 为所有 webworker 创建一个暂停机制,以便主线程可以确定所有 webworker 何时刷新了他们的消息(基本上需要防止 postMessage 在键盘启动时在任何 worker 上被调用)。
- 防止键盘在可编辑元素上弹出。在可编辑元素上检测到点击/点击事件后,您需要手动调用焦点函数。
- 覆盖打开键盘的可编辑元素的焦点功能。 Focus 现在将调用 pause workers 函数。所有worker暂停后,调用focus的浏览器实现。
- 将 focusout 事件监听器添加到可编辑元素,以便调用 resume workers 函数。
我的 github 上有一个半抽象版本可供其他人使用。我们在相当复杂/大型且严重依赖动画+ajax 的应用程序中使用 github 版本,几乎没有问题。
关于javascript - 屏幕解锁后如何在 iOS8 网络应用程序上恢复 JavaScript 计时器?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26008300/