CODEWITHSUNDEEP
octobercmsoctobercms-pluginsoctobercms-backend
Crazy
Crazy

Reputation: 376

How using ServiceWorker with Themes in OctoberCMS

I would like to know if it is possible to use the ServiceWorker within an OctoberCms theme? Currently I created a file called serviceworker.js, and apparently it is being recognized, the doubt is being on the offline page, after all, how am I going to create a file to work offline within the october theme?

To get clearer, I'm putting below the example of my serviceworker. My question is how do I add the offline page in the 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);
    })
  );
});

Upvotes: 0

Views: 230

Answers (1)

Artful_dodger
Artful_dodger

Reputation: 738

Hi Crazy there are a few things you need to address first one is that the service-worker.js file must be in the root of your web site secondly you must amend your .htaccess file to allow this file to be seen by placing this 'RewriteCond %{REQUEST_FILENAME} !service-worker.js' in the white listed folders section and thirdly you need to call this file from your app.js or theme.js file I hope this helps you with your project

Upvotes: 1

Related Questions