如何在 OctoberCMS 中使用带有主题的 ServiceWorker答案

【问题标题】：How using ServiceWorker with Themes in OctoberCMS如何在 OctoberCMS 中使用带有主题的 ServiceWorker
【发布时间】：2019-05-29 19:05:47
【问题描述】：

我想知道是否可以在 OctoberCms 主题中使用 ServiceWorker？目前我创建了一个名为 serviceworker.js 的文件，显然它正在被识别，怀疑是在离线页面上，毕竟我要如何创建一个文件以在 october 主题中离线工作？

为了更清楚，我把我的 serviceworker 的例子放在下面。我的问题是如何在 serviceworker 中添加离线页面？

var CACHE_NAME = 'static-v1';

self.addEventListener('install', function (event) {
  event.waitUntil(
    caches.open(CACHE_NAME).then(function (cache) {
      return cache.addAll([
        '/',
        '../js/main.min.js',
        '../css/style.min.css',       
      ]);
    })
  )
});

self.addEventListener('activate', function activator(event) {
  event.waitUntil(
    caches.keys().then(function (keys) {
      return Promise.all(keys
        .filter(function (key) {
          return key.indexOf(CACHE_NAME) !== 0;
        })
        .map(function (key) {
          return caches.delete(key);
        })
      );
    })
  );
});

self.addEventListener('fetch', function (event) {
  event.respondWith(
    caches.match(event.request).then(function (cachedResponse) {
      return cachedResponse || fetch(event.request);
    })
  );
});

【问题讨论】：

标签： octobercms octobercms-plugins octobercms-backend

【解决方案1】：

嗨，Crazy，您需要解决一些问题，第一是 service-worker.js 文件必须位于您网站的根目录中，其次您必须修改您的 .htaccess 文件以允许该文件被查看将此 'RewriteCond %{REQUEST_FILENAME} !service-worker.js' 放在白名单文件夹部分，第三，您需要从 app.js 或 theme.js 文件中调用此文件，希望这对您的项目有所帮助

【讨论】：