Czy w JavaScript można wykryć, kiedy ekran jest wyłączony w przeglądarkach na urządzeniach z Androidem i iOS?

Question

Wyszukałem trochę absurdalnie wysokich czasów ładowania, które zgłosił javascript mojej aplikacji, i odkryłem, że Android (i iOS) wstrzymują niektóre JavaScript wykonanie, gdy okno jest w tle lub wyświetlacz jest wyłączony.

Na Androidzie stwierdziłem, że mogę użyć zdarzeń window.onfocus i onblur, aby wykryć, kiedy aplikacja przełączała się na tło (i wykonanie js wkrótce zostanie wstrzymane, przynajmniej dla nowych skryptów), ale nie mogę znaleźć sposób na wykrycie, kiedy ekran jest włączony lub wyłączony. czy to możliwe?

(On Safari, miałem podobne wyniki z wyjątkiem tego onfocus i onblur nie ogień niezawodnie.)

Answer 1

Istnieje kilka opcji, aby to sprawdzić:

1. Korzystanie Visibility API

2. Korzystanie focus i blur zdarzenia do wykrywania przeglądarki widoczność zakładka:

 
window.addEventListener("focus", handleBrowserState.bind(context, true)); 
window.addEventListener("blur", handleBrowserState.bind(context, false)); 

function handleBrowserState(isActive){ 
    // do something 
} 

3. Korzystanie z timerów, jak wspomniano powyżej:

Answer 2

Właśnie znalazłem dość dobre rozwiązanie dla mojego przypadku użycia:

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); 

Kiedy ekran jest wyłączony (lub JS jest wstrzymany z dowolnego powodu), następny interwał jest opóźniony do czasu wznowienia wykonywania JS. W moim kodzie mogę ustawić timery na wartość offBy i nazwać to dobrze.

W szybkich testach wszystko to działa dobrze zarówno w przeglądarce Androida 4.2.2, jak i Safari na iOS 6.1.3.

Answer 3

co zrobisz w swoim skrypcie, gdy ekran się wyłączy? Cóż, w każdym razie można wstrzykiwać obiekty Java (http://developer.android.com/reference/android/webkit/WebView.html#addJavascriptInterface(java.lang.Object,%20java.lang.String)) w celu połączenia z działaniem i pełnomocnictwa dla wszystkich informacji wymaganych w świecie JS.

Answer 4

Znaleziony piękny funkcję tutaj:

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); 
})(); 

Aby zarejestrować się na wydarzenie:

addEventListener("resume", function() { 
    alert('Resuming this webapp'); 
}); 

Jest to zgodne z Cordova, który również wyzwala zdarzenie resume.