Почему мой сервисный работник только кэширует посещенные страницы? - PullRequest
0 голосов
/ 14 ноября 2018

В настоящее время я разрабатываю простой PWA с индексным файлом, который содержит поле ввода, в котором вы можете ввести свой штрих-код и нажать «Отправить».Затем будет отображен PHP-файл, показывающий некоторую информацию о наркотиках, полученных из базы данных MySQL.

Сейчас я пытаюсь кэшировать оболочку приложения для загрузки необходимых ресурсов (html, css, сценарии и т. Д.)когда приложение работает в автономном режиме.Я вроде как преуспел в этом, но, похоже, он работает, только когда страница, которую вы пытаетесь кэшировать, уже посещена один раз, когда приложение было в сети.И это только в том случае, когда я регистрирую того же работника службы на странице результатов, а не только на странице индекса.

По-видимому, этот вид кэширования, в котором кэшируются только посещенные страницы, называется «частичным».кэширование моим профессором.Мне не нужно это частичное кеширование, я хочу полное кеширование, при котором работник службы один раз регистрируется в файле индекса, а затем кэширует все необходимые файлы для кэширования, чтобы я мог использовать его в автономном режиме.

Вот так выглядит мой сервисный работник:

var cacheName = 'pillexplainerPWA';
var filesToCache = [
'http://localhost:80/MedicationProject/',
'http://localhost:80/MedicationProject/index.html',
'http://localhost:80/MedicationProject/result.php',
'http://localhost:80/MedicationProject/result2.html',
'http://localhost:80/MedicationProject/scripts/app.js',
'http://localhost:80/MedicationProject/styles/main.css',
'http://localhost:80/MedicationProject/styles/result.css',
'http://localhost:80/MedicationProject/images/back-button.jpg',
'http://localhost:80/MedicationProject/images/barcode.jpg'
];

self.addEventListener('install', function(e) {
  console.log('[ServiceWorker] Install');
  e.waitUntil(
    caches.open(cacheName).then(function(cache) {
      console.log('[ServiceWorker] Caching app shell');
      return cache.addAll(filesToCache);
    })
  );
});

 self.addEventListener('activate', function(e) {
     console.log('[ServiceWorker] Activate');
     e.waitUntil(
       caches.keys().then(function(keyList) {
         return Promise.all(keyList.map(function(key) {
           if (key !== cacheName) {
             console.log('[ServiceWorker] Removing old cache', key);
             return caches.delete(key);
           }
         }));
       })
     );
     return self.clients.claim();
   });

self.addEventListener('fetch', function(e) {
  console.log('[ServiceWorker] Fetch', e.request.url);
  e.respondWith(
    caches.match(e.request).then(function(response) {
      return response || fetch(e.request);
    })
  );
});

Может кто-нибудь объяснить мне, что я делаю неправильно, и что нужно настроить для этого кода, чтобы он не кэшировал только то, чтопосещается, но все в тот момент, когда загружается index.html?Странно то, что когда я заглядываю в кеш при запуске index.html ... он показывает мне все мои файлы, которые там находятся.Но когда я перехожу в автономный режим, а затем нажимаю кнопку отправки, чтобы перейти на страницу результатов, кэш не загружается.

...