在JavaScript中,是否可以检测Android和Android屏幕何时关闭? iOS浏览器

时间:2013-04-11 21:31:57

标签: javascript android ios mobile-safari android-browser

我正在跟踪我的应用程序的javascript报告的一些非常高的加载时间,并发现Android(和iOS)在窗口处于后台或显示关闭时暂停一些JavaScript执行。

在Android上,我发现我可以使用window.onfocusonblur事件来检测应用何时切换到后台(并且js执行将很快暂停,至少对于新脚本而言) ,但我无法找到一种方法来检测屏幕何时打开或关闭。这可能吗?

(在Safari上,我有类似的结果,但onfocusonblur无法可靠地触发。)

4 个答案:

答案 0 :(得分:12)

我刚刚为我的用例找到了一个非常好的解决方案:

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。

答案 1 :(得分:8)

检查它的选项很少:

  1. 使用Visibility API

  2. 使用focusblur个事件来检测浏览器标签的可见性:

  3. window.addEventListener("focus", handleBrowserState.bind(context, true));
    window.addEventListener("blur", handleBrowserState.bind(context, false));
    
    function handleBrowserState(isActive){
        // do something
    }
    
    1. 使用定时器,如上所述

答案 2 :(得分:4)

在这里找到了一个不错的功能:

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事件。

答案 3 :(得分:3)

屏幕关闭后,您将在脚本中执行哪些操作?好吧,无论如何,你可以注入Java对象(http://developer.android.com/reference/android/webkit/WebView.html#addJavascriptInterface(java.lang.Object,%20java.lang.String))来与活动接口,并代理JS世界所需的所有信息。