Service Worker - 排除路径

Question

Is there a possibility to exclude some paths in service worker?

For example, I have my application: www.application.com and an admin panel www.application.com/superadmin

I want to disable SW in /superadmin/* path.

I saw that there is a scope option, but in my case, it's must be / https://developer.mozilla.org/en-US/docs/Web/Manifest/serviceworker

Maybe you have any ideas or experience on how to solve this problem?

Answer 1

在这种情况下无法完全禁用 serviceworker（尽管您始终可以让 serviceworker 忽略对子路径的获取请求）-尽管有一项建议可以在将来启用更细粒度的 serviceworker 范围： https:// github.com/wanderview/service-worker-scope-pattern-matching/blob/master/explainer.md

Answer 2

There is a way. We can add an array list of items to exclude, and add a search into the fetch event listener.

Include and exclude method below for completeness.

var offlineInclude = [
    '',                // index.html
    'site.css',
    'js/sitejs.js'
];

var offlineExclude = [
    '/bigimg.png',                 //exclude a file
    '/networkimages/smallimg.png', //exclude a file in a specific directory
    '/admin/'                      //exclude a directory
];

self.addEventListener("install", function(event) {
  console.log('WORKER: install event in progress.');
  event.waitUntil(
    caches
      .open(version + 'fundamentals')
      .then(function(cache) {
        return cache.addAll(offlineInclude);
      })
      .then(function() {
        console.log('WORKER: install completed');
      })
  );
});

self.addEventListener("fetch", function(event) {
  console.log('WORKER: fetch event in progress.');

  if (event.request.method !== 'GET') {
    console.log('WORKER: fetch event ignored.', event.request.method, event.request.url);
    return;
  }

  for (let i = 0; i < offlineExclude.length; i++)
  {
    if (event.request.url.indexOf(offlineExclude[i]) !== -1)
    {
      console.log('WORKER: fetch event ignored. URL in exclude list.', event.request.url);
      return false;
    }
  }