2017-01-25 1 views
2

Возможно ли идентифицировать обновления на сервере, то есть есть обновления на странице (HTML) или в стиле (CSS) и сделать запрос на сервер для получения обновленных данных? Если да, то как?Как идентифицировать обновления на сервере с сервисным работником?

ответ

3

Вскоре;

  1. Когда служба изменения рабочий сценарий, он будет установлен, чтобы заменить старый один пользователь имеет как только пользователь получает онлайн с PWA.
  2. Вы должны отразить изменения в массиве предметов, которые у вас есть в вашем SW.
  3. Необходимо изменить имя кеша и удалить старый кеш.
  4. В результате ваши пользователи всегда будут иметь последнюю версию вашего приложения.

С подробностями;

1) Измените свой SW, чтобы заменить одного пользователя в настоящее время.

Даже малейшего изменения в вашем SW достаточно, чтобы его можно рассматривать как новую версию, поэтому он перейдет на старый. Эта цитата из Google Web Developers объясняет это;

Обновление вашего рабочего рабочего файла JavaScript. Когда пользователь переходит на ваш сайт, браузер пытается перезагрузить файл сценария, который определил работника службы в фоновом режиме. Если в файле рабочего пользователя есть разница в размере байта по сравнению с тем, что у него есть , он считает его новым.

Лучшая практика заключается в сохранении номера версии в любом месте вашего ПО и ее программном обновлении при изменении содержимого. Это может даже быть процитировано, не имеет значения, оно все равно будет работать. Помните: даже разница в байтах достаточно.

2) Отразите свои изменения в списке элементов, которые нужно кэшировать.

Вы сохраняете список активов, которые будут кэшироваться в вашем SW. Поэтому отразите добавленные/обновленные/удаленные активы в свой список. Лучшей практикой будет setting up cache buster для ваших активов. Это потому, что SW находится в слое за кешем браузера, так сказать.

Другими словами: запросы на выбор из SW проходят через кеш браузера.Таким образом, SW выберет новых активов из кеша браузера, а не сервера, и кеширует их до тех пор, пока SW не изменится.

В этом случае вы получите половину своих пользователей, используя вашу PWA с новыми активами, в то время как другая половина страдает от недоверчивых ошибок. И у вас будет замечательное время с чрезмерным воздействием жалоб и разочарования в том, что вы не можете найти причину или способ воспроизвести их.

3) Заменить свой старый кэш, сделать не слияния его.

Если вы не измените имя кеша для вашего обновленного списка активов, они будут объединены со старыми.

Слияние будет происходить таким образом, что старые и удаленные активы будут сохранены, а новые добавленные и измененные будут заменены. Хотя, похоже, все будет хорошо работать, вы будете накапливать старые активы на устройствах пользователей. And space you are storing is not infinite.

4) Все счастливы

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

Поэтому я рекомендую вам разработать свой SW для раз и навсегда.

-1

Посмотрите на LiveJS, чтобы динамически обновить css.
Я считаю, что решение, которое они используют, это добавить параметр get с меткой времени на страницу css или html: /css/style.css?time=1234 и вычислить хэш результата. Если хэш изменился со времени последней проверки, обновите CSS, в противном случае продолжайте искать.

Аналогичная реализация может быть построена из HTML, но я не видел подобных проектов для нее. Вы должны взглянуть на Ajax, если вы хотите автоматически обновлять данные на своей странице.

0

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

https://developers.google.com/web/fundamentals/getting-started/primers/service-workers#update-a-service-worker

Следует также отметить, что на данный момент существует открытая issue и Service worker JavaScript update frequency (every 24 hours?) как работник службы не может быть изменен из-за браузера кэш.

Однако вы также можете взглянуть на sw-precache, который делает это за вас (например, через задачу с глотком)

Смежные вопросы