self.addEventListener ('fetch', function (e) {}) не работает

Question

У меня есть сомнения в PWA, и я буду рад, если кто-нибудь поможет мне с этим. В моем PWA у меня нет проблем с хранением статических файлов, таких как HTML, JS и CSS. Но сталкиваюсь с проблемами динамических данных. то есть: мой self.addEventListener('fetch', function(e) { }) не вызывается, но другие функции работают нормально, т.е. события 'install' и 'active'.

Если быть более точным, я использую @angular/service-worker, который работал нормально, но я создал другой SW-файл с именем sw.js. В моем sw-js я слушаю такие события, как 'install', 'active' и 'fetch'. Мой sw.js fetch не вызывается, тогда как другие два метода работают хорошо. Но при извлечении вызывается только метод ngsw-worker.js.

Мне нужно сделать CRUD-операции в PWA с угловым режимом.

Заранее спасибо!

Answer 1

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

self.addEventListener("fetch", function (event) {


    event.respondWith(
      caches.open("dynamiccache").then(function (cache) {
        return fetch(event.request).then(function (res) {
          cache.put(event.request, res.clone());
          return res;
        })
      })
    )
  }

Примечание. Вы не можете кэшировать POST-запросы. Могут ли работники службы кэшировать POST-запросы?