Фоновая синхронизация JavaScript перестает работать, если страница загружена / обновлена ​​в автономном режиме

В настоящее время я изучаю, как использовать фоновую синхронизацию, чтобы позволить пользователям вносить изменения в POST/POST при использовании веб-приложения в автономном режиме.

Я следовал инструкциям, данным Джейком Арчибальдом в разделе " Введение в фоновую синхронизацию", и все работало замечательно… до тех пор, пока я регистрировал фоновую синхронизацию, когда веб-приложение загружалось, когда он был в сети. Что я имею в виду под этим:

Шаги, которые работают:

  1. В Интернете я открываю веб-приложение
  2. Я включаю автономный режим на вкладке сети
  3. Я нажимаю некоторые кнопки, которые регистрируют фоновую синхронизацию.
  4. Я отключаю автономный режим, поэтому приложение возвращается в режим онлайн.
  5. Фоновая синхронизация срабатывает.

Шаги, которые заставляют это перестать работать:

Он перестает работать полностью, даже в приведенном выше сценарии, если я сделаю следующее:

  1. Находясь на другом сайте, я включаю автономный режим на вкладке сети.
  2. Я перехожу к своему веб-приложению, которое доступно в автономном режиме благодаря работнику службы.
  3. Я нажимаю некоторые кнопки, которые должны зарегистрировать фоновую синхронизацию.
  4. Я отключаю автономный режим на вкладке сети.
  5. Ничего не произошло.
  6. После того, как я перехожу на вкладку "Приложение", отменяю регистрацию работника службы и снова пытаюсь выполнить новую установку, первые шаги работают, но второй набор шагов продолжает нарушать фоновую синхронизацию

Код:

На странице:

//requesting a one-off sync:
navigator.serviceWorker.ready.then(function (reg) {
  return reg.sync.register('sync-tag');
}).catch(function (e) {
  console.error(e, "System was unable to register for a sync");
});

Работник службы

self.addEventListener('sync', event => {
  if (event.tag == 'sync-tag') {
    event.waitUntil( doStuff() )
  }
});

Обновить

Когда код работает, я использовал следующий код для отслеживания тегов, отправленных на регистрацию:

navigator.serviceWorker.ready.then(function (reg) {
  console.log('before', reg.sync.getTags());
  reg.sync.register('sync-tag');
  console.log('after', reg.sync.getTags());
}).catch(function (e) {
  console.error(e, "System was unable to register for a sync");
});

При использовании шагов, которые работают, я получаю

before: resolved to an empty array
after: resolved to an array with one tag ['sync-tag']

При использовании шагов, которые заставляют это перестать работать:

before: resolved to an array with one tag ['sync-tag']
after: resolved to the same array above

Это наводит меня на мысль, что регистрация синхронизации происходит, но работник службы не listening больше. И независимо от того, что я делаю, например, закрываю вкладку браузера, обновляю страницу, когда в сети, подожди, работник службы просто не будет listen синхронизировать события больше.

Я понимаю, что браузер должен решить, когда выполнять фоновую синхронизацию, но я просто не понимаю, почему это не работает. Если ожидаемое поведение состоит в том, чтобы ожидать, что пользователь посетит веб-приложение в Интернете, я думаю, что я получаю что-то неправильно.

Спасибо за ваше терпение, и мы будем благодарны за любую помощь в понимании того, как заставить работать Background Sync.

Источник

1 ответ

Хорошо, я чувствую себя глупо Именно браузер решает, когда выполнять фоновую синхронизацию.

Поведение, которое я ожидал, неверно:

  1. Доступ к приложению в автономном режиме.
  2. Изменения POST/PUT с фоновой синхронизацией
  3. Вернитесь в онлайн, обновите страницу и сразу увидите изменения

Поведение браузера фактически реализовано:

Доступ к приложению в режиме онлайн:

  1. Доступ к приложению онлайн.
  2. приложение переходит в автономный режим (вручную или нет)
  3. Изменения POST/PUT с фоновой синхронизацией
  4. приложение выходит в интернет и обновляется
  5. Изменения происходят мгновенно, поскольку синхронизация происходит, как только приложение выходит в сеть. Браузер может обнаружить изменения из онлайн, обратно в онлайн?

Доступ к приложению в автономном режиме

  1. Доступ к приложению в автономном режиме.
  2. POST/PUT изменяется с помощью Background Sync.
  3. приложение выходит в интернет и обновляется
  4. Изменения не являются мгновенными. Каким-то образом браузер решает пока не выполнять синхронизацию.
  5. Полностью закройте браузер и вернитесь на страницу
  6. Браузер синхронизируется.

Поэтому трудно знать, когда браузер выполнит синхронизацию, и только при доступе к приложению в режиме онлайн синхронизируется ли браузер, если он обнаруживает изменение из офлайн, а затем онлайн в том же сеансе (без обновления?)

Источник
Другие вопросы по тегам