Chrome Tab Freezing и SetTimeout / Web Workers - PullRequest
Новая
       33

Chrome Tab Freezing и SetTimeout / Web Workers

1 голос
/ 24 января 2020

Chrome 79 был только что выпущен с новой функцией замораживания вкладок , включенной по умолчанию. Кто-нибудь знает способ обойти это при работе с setTimeouts (или даже веб-работниками) в JavaScript?

У нас запущен некоторый код для проверки активности клиента, чтобы облегчить более плавный тайм-аут / выход из системы через определенное время. К сожалению, ни один из них не работает, когда вкладка находится в «замороженном» состоянии.

Есть идеи?

1 Ответ

0 голосов
/ 24 января 2020

На основе API возраста жизненного цикла Я создал этот класс: 

const pageLifecycle = new class PageLifecycle extends EventTarget {
  constructor() {
    super();
    this.state = this.getState();
    const fn = () => this.stateChange(this.getState()),
      opt = { capture: true },
      events = {
        pageshow: fn,
        focus: fn,
        blur: fn,
        visibilitychange: fn,
        resume: fn,
        freeze: () => this.stateChange("frozen"),
        pagehide: event => this.stateChange(event.persisted ? "frozen" : "terminated")
      };
    for (const [event, fn] of Object.entries(events)) window.addEventListener(event, fn, opt);
  }
  getState() {
    return document.visibilityState === "hidden" ? "hidden" : document.hasFocus() ? "active" : "passive";
  }
  stateChange(nextState) {
    if (nextState === this.state) return;
    const prevState = this.state;
    this.state = nextState;
    this.dispatchEvent(Object.assign(new Event("stateChange"), { prevState, state: this.state }));
  }
};

//--------
pageLifecycle.addEventListener("stateChange", event => console.log(`State change: ${event.prevState} >>> ${event.state}`));

Вы можете добавить к нему прослушиватель событий (событие: stateChange), и вы получите один из ["active", "passive", "hidden", "frozen", "terminated"] в event.state. Проверьте на passive и сохраните свои данные. Вы можете проверить event.prevState, чтобы получить предыдущее состояние, чтобы определить, следует ли принудительно проверять сервер, чтобы убедиться, что пользователь все еще входит в систему.

...