Переопределение сервисного работника Angular для обработки запросов POST - PullRequest
1 голос
/ 03 октября 2019

У меня есть приложение angular / nodejs, в котором пользователь может видеть список ресурсов, обновлять их, создавать и удалять их (базовое приложение CRUD). Я хочу превратить это в PWA, чтобы пользователь мог работать в автономном режиме. Он должен:

  • Кэшировать активы (html, css ...)
  • Кэшировать результат запросов GET
  • Сохранять запросы POST / PUT / DELETE вотправьте их позже, когда соединение будет доступно.

Итак, сначала я попытался добавить сервисного работника Angular в свое приложение, следуя документации, приведенной здесь: https://angular.io/guide/service-worker-getting-started ng add @angular/pwa

Первые два пункта работали хорошо: в автономном режиме я все еще мог просматривать список ресурсов. Но все запросы POST / PUT / DELETE были неудачными, , поскольку он только кэширует немутантные запросы

Затем я наткнулся на это руководство , которое описывает, как расширить Angular Service. Работник.

Используя этот код:

importScripts('./ngsw-worker.js');
self.addEventListener('fetch', (event) => {
  console.log('fetch event !')
  // Here do something to store request if method is POST/PUT/DELETE
});

У меня нет настраиваемого события выборки, поскольку внутри ngsw-worker.js уже определен обработчик события «выборка», который перехватывает событие. Если я объявлю своего слушателя раньше, чем у Angular:

self.addEventListener('fetch', (event) => {
  console.log('fetch event !')
  // Here do something to store request if method is POST/PUT/DELETE
});
importScripts('./ngsw-worker.js');

Тогда я смогу просмотреть журнал, однако автономный режим больше не работает, я полагаю, что это потому, что слушатель Angle 'fetch' не запускается.

В заключение, кажется, что сервисные работники Angular могут быть не лучшим решением для моего варианта использования. Я встречал этот ресурс , который объясняет, как хранить запросы POST / PUT, но не упоминает Angular.

Есть ли другой способ переопределить работника службы angular для хранения запросов? Или я должен использовать другую технологию, которая бы соответствовала моим потребностям, если таковые имеются? Спасибо,

...