Как определить фокус браузера на мобильных устройствах?

Question

Приложение, которое я разрабатываю, построено на jQuery Mobile и некотором Ajax для обновления частей страницы.Как и сайты, которые используют автоматическое обновление, я хочу остановить обновление после некоторого условия (время / видимость / и т. Д.), Чтобы мой сервер не был засыпан ненужными запросами.Приложение имеет экран состояния, который обычно проверяется пользователем, и в идеале мои сценарии должны знать, что окно браузера попало в фокус, и это было бы подходящее время для обновления.Я делал это раньше в настольных веб-приложениях, но заметил, что на мобильных устройствах существует множество различий между различными платформами и браузерами, например:

• window.onfocus () делает / n 'не срабатывает, когда браузер получает фокус
• window.onfocus () не запускается / не срабатывает при переключении вкладок в браузере
• JavaScript не приостановлен между переключателями вкладок и / илиОтключается от браузера

Лучшее, что я смог сделать до сих пор, - это набор эвристик, которые смотрят на доступные события +, когда было обнаружено взаимодействие пользователя со страницей, но это неуклюже и результатыв тех случаях, когда пользователь возвращается на страницу и должен обновить ее вручную.Не отлично.

Какие-нибудь умные методы для решения этой проблемы?

Answer 1

Если вы просто хотите узнать, было ли окно браузера не в фокусе, используйте функцию requestAnimationFrame.

window.requestAnimFrame = window.requestAnimationFrame ||
                          window.mozRequestAnimationFrame || 
                          <add browsers here>

Тогда в вашем коде

var lastupdate = new Date()
(function loop() {
      var now = new Date();

      if ( now - lastupdate > <some treshold like 1 second> ) {
          // browser was suspended and did come back to focus
      }
      lastupdate = now;

      window.requestAnimFrame(loop);
})();

Хитрость в том, что браузеры не дают анимационный кадр, если вкладка или окно не в фокусе.Обычные setInterval и setTimeouts все равно будут работать.Этот цикл будет выполняться непрерывно, когда окно находится в фокусе, но издержки минимальны, на мобильных устройствах его можно вызывать 3-5 раз в секунду.