Когда PWA Workbox / create-реагировать-приложение обновляются до новых ресурсов stati c? - PullRequest
0 голосов
/ 15 марта 2020

У меня есть PWA, который был сделан с create-react-app. Кодовая база PWA регулярно обновляется, и мы ежедневно выпускаем новые версии приложения.

Я заметил различное поведение в отношении обновлений нашего PWA в двух разных случаях использования. Я хотел бы рассказать о том, что заметил, и надеюсь, что кто-то с опытом работы в рабочей среде сможет объяснить, почему ?

Я должен сказать, что мы оптимизируем обновление клиентов как можно скорее с помощью этого:

          if ('serviceWorker' in navigator) {
            navigator.serviceWorker.addEventListener('controllerchange', function () {
              if (confirm('New version of app available; update now?')) window.location.reload();
            });
          }  

Рабочий стол Chrome Использование

Каждый раз, когда мы выпускаем, каждый, кто обращается к приложению, впоследствии видит приглашение «Доступна новая версия приложения» и получает обновление. Эта версия обычно используется людьми, которые работают с приложением через интр anet нашей компании.

Android Добавлен в PWA на главном экране

Другой пример использования - это то же приложение установлен на телефонах Android. Эта версия доступна в inte rnet за Cloudflare.

Мы еще никогда не видели "Доступна новая версия приложения" в этом контексте. Скорее, в какой-то момент приложение обновляется, и мы видим новый контент.

Вопрос

Итак, вопрос в том, что инициирует обновление PWA в контексте добавленного на главный экран? Я не уверен, но у меня есть некоторые косвенные доказательства:

Обновления в этом контексте, кажется, происходят в течение 7 дней. Интересно, что ресурсы c (JS / CSS / HTML) кэшируются в нашем приложении на 7 дней.

Мне интересно, может быть, здесь причина в Cloudflare? Или политика кэширования активов c? Или оба? Или что-то еще?

Если бы кто-то мог пролить свет, я бы с удовольствием поучился!

1 Ответ

0 голосов
/ 30 марта 2020

Прошло много времени с тех пор, как я посмотрел на кодовую базу create-react-app. В общем, мы рекомендуем этот рецепт для обнаружения, когда есть новый сервисный работник, который был установлен и находится в состоянии waiting. Он использует workbox-window для упрощения некоторых взаимодействий между работником службы и страницей клиента - например, приказывает работнику службы вызвать skipWaiting(), чтобы новый работник службы получил возможность активироваться, а затем перезагружает страницу, как только она

Нет ничего конкретного c для добавления веб-приложения на домашний экран Android, из-за которого поведение проверки обновлений работника службы может отличаться от рабочего стола Chrome. В обоих случаях проверка обновленного сервисного работника происходит по причинам, изложенным в этом разделе руководства "Жизненный цикл сервисного работника".

Если вы заметили различия между средами, тогда да, похоже, что кеширование CDN могло бы объяснить это. В частности, если ваш service-worker.js (или как он там называется) обслуживается через CDN, вам нужно убедиться, что CDN удаляет свою старую копию файла и заменяет ее версией из вашей последней сборки каждый раз время развертывания. Если вы этого не сделаете, это объяснит поведение, которое вы видите.

...