CSS не отображается в автономном режиме с помощью Service Worker в Chrome

0

Вопрос

Я пытаюсь заставить свой PWA работать в автономном режиме. До сих пор он обслуживает все файлы с локального хоста, но CSS не отображается. Все файлы, запрошенные из кэша, получают статус 200. (javascript и html полностью функциональны) Вот мой служебный код.

self.addEventListener("install", (event) => {
  event.waitUntil(
    caches.open("v1").then((cache) => {
      return cache.addAll([
        "list of assets",        
      ]);
    })
  );
});

self.addEventListener("fetch", function (event) {
  event.respondWith(
    caches.open("v1").then((cache) => {
      if (event.request.url == "http://localhost:3000/") {
        return cache
          .match("http://localhost:3000/index.html")
          .then((response) => {
            console.log({ response });
            return response;
          });
      } else {
        try {
          return cache.match(event.request).then((response) => {
            console.log(response);
            if (response != undefined) {
              console.log({ response: "Loading asset from cache." });
              return response;
            } else {
              let asset = fetch(event.request);
              cache.add(asset);
              return asset;
            }
          });
        } catch (error) {
          console.error(error);
        }
      }
    })
  );
});

1

Лучший ответ

0

Вы пробовали перечислить свою таблицу стилей, где у вас есть "список активов"?

return cache.addAll([
    ‘./css/styles.css'
  ]);
2021-11-23 02:43:10

Да, он есть, и по запросу получает статус 200; Я забыл упомянуть, что я также использую vite. Это происходит только на локальном хосте, отлично работает на обычном хосте.
TK421

На других языках

Эта страница на других языках

Italiano
..................................................................................................................
Polski
..................................................................................................................
Română
..................................................................................................................
한국어
..................................................................................................................
हिन्दी
..................................................................................................................
Français
..................................................................................................................
Türk
..................................................................................................................
Česk
..................................................................................................................
Português
..................................................................................................................
ไทย
..................................................................................................................
中文
..................................................................................................................
Español
..................................................................................................................
Slovenský
..................................................................................................................