是否可以在 JavaScript 中检测 Android 和 iOS 浏览器何时关闭屏幕
Posted
技术标签:
【中文标题】是否可以在 JavaScript 中检测 Android 和 iOS 浏览器何时关闭屏幕【英文标题】:Is it possible, in JavaScript, to detect when the screen is turned off in the Android & iOS browsers 【发布时间】:2013-04-04 06:22:32 【问题描述】:我正在跟踪我的应用程序的 javascript 报告的一些可笑的高加载时间,并发现当窗口在后台或显示屏关闭时,android(和 ios)会暂停一些 JavaScript 执行。
在 Android 上,我发现我可以使用 window.onfocus
和 onblur
事件来检测应用程序何时切换到后台(并且 js 执行很快就会暂停,至少对于新脚本而言),但我可以找不到检测屏幕何时打开或关闭的方法。这可能吗?
(在 Safari 上,我得到了类似的结果,只是 onfocus
和 onblur
没有可靠地触发。)
【问题讨论】:
鉴于 Android 通常会进入某种锁定屏幕,关闭和打开屏幕是否不会触发onblur
和 onfocus
事件?我认为关闭它可能会触发onblur
,至少唤醒它会触发onblur
(如果没有关闭它),因为Android会打开锁定屏幕,然后在通过锁定屏幕之后, onfocus
将触发,因为您正在从锁定屏幕转换回活动应用程序。我不是 Android 专家,但我想如果你不检查的话,我会把这个想法扔掉。
好吧,我测试的时候没有,但现在你提到它,我已经禁用了我的锁定屏幕。只要我按下电源按钮,它就会回到我打开的最后一个应用程序。启用锁定屏幕会导致触发焦点和模糊事件。谢谢!
【参考方案1】:
检查它的选项很少:
使用Visibility API
使用focus
和blur
事件检测浏览器标签可见性:
-
如上所述使用计时器
【讨论】:
哈,页面可见性规范的初稿在我发布问题大约一个月后发布!在这一点上,这似乎是正确的答案。 获得正确答案 3 年 :) 我现在正在处理同样的问题,并且已经获得了很多新信息......但我仍然遇到 Android Internet Browser 的一些问题(基于Chromium 34) - 此浏览器不处理可见性更改,并且上述方法均无效...【参考方案2】:我刚刚为我的用例找到了一个很好的解决方案:
function getTime()
return (new Date()).getTime();
var lastInterval = getTime();
function intervalHeartbeat()
var now = getTime();
var diff = now - lastInterval;
var offBy = diff - 1000; // 1000 = the 1 second delay I was expecting
lastInterval = now;
if(offBy > 100) // don't trigger on small stutters less than 100ms
console.log('interval heartbeat - off by ' + offBy + 'ms');
setInterval(intervalHeartbeat, 1000);
当屏幕关闭时(或 JS 因任何原因暂停),下一个间隔会延迟,直到 JS 执行恢复。在我的代码中,我可以通过 offBy
数量调整计时器并称之为好。
在快速测试中,这似乎在 Android 4.2.2 的浏览器和 iOS 6.1.3 的 Safari 上运行良好。
【讨论】:
【参考方案3】:在这里找到了一个不错的功能:
http://rakaz.nl/2009/09/iphone-webapps-101-detecting-essential-information-about-your-iphone.html
(function()
var timestamp = new Date().getTime();
function checkResume()
var current = new Date().getTime();
if (current - timestamp > 4000)
var event = document.createEvent("Events");
event.initEvent("resume", true, true);
document.dispatchEvent(event);
timestamp = current;
window.setInterval(checkResume, 1000);
)();
报名参加活动:
addEventListener("resume", function()
alert('Resuming this webapp');
);
这与 Cordova 一致,后者也会触发 resume
事件。
【讨论】:
【参考方案4】:一旦屏幕关闭,您将在脚本中做什么?无论如何,您可以注入 Java 对象 (http://developer.android.com/reference/android/webkit/WebView.html#addJavascriptInterface(java.lang.Object,%20java.lang.String)) 来与活动交互并代理您在 JS 世界中所需的所有信息。
【讨论】:
不是我想做的事,但你得到了一个赞成票,因为它是对这个问题的一个很好的答案:)以上是关于是否可以在 JavaScript 中检测 Android 和 iOS 浏览器何时关闭屏幕的主要内容,如果未能解决你的问题,请参考以下文章