https://nerimarketing.net/serviceWorker.js

1
2	const CACHE_NAME = "cache-v260810145113";
3	const urlsToCache = [
4	  "/",
5	];
6	const neverCacheUrls = [
7	   "/wp-admin/",
8	   "/wp-login/",
9	   "preview=true",
10	 ];
11
12	 // 現在のURLがneverCacheUrlsリストにあるかどうかを確認する
13	 function checkNeverCacheList(url) {
14	   if ( this.match(url) ) {
15	     return false;
16	   }
17	   return true;
18	 }
19
20	self.addEventListener("install", (event) => {
21	  event.waitUntil(
22	    caches.open(CACHE_NAME)
23	    .then((cache) => {
24	      console.log("Opened cache");
25
26	      // 指定されたリソースをキャッシュに追加する
27	      return cache.addAll(urlsToCache);
28	    })
29	  );
30	});
31
32	self.addEventListener("activate", (event) => {
33	  var cacheWhitelist = [CACHE_NAME];
34
35	  event.waitUntil(
36	    caches.keys().then((cacheNames) => {
37	      return Promise.all(
38	        cacheNames.map((cacheName) => {
39	          // ホワイトリストにないキャッシュ(古いキャッシュ)は削除する
40	          if (cacheWhitelist.indexOf(cacheName) === -1) {
41	            return caches.delete(cacheName);
42	          }
43	        })
44	      );
45	    })
46	  );
47	});
48
49	self.addEventListener("fetch", (event) => {
50	  if ( !neverCacheUrls.every(checkNeverCacheList, event.request.url) ) {
51		  console.log( "non cache page" );
52		  return;
53		}
54	  event.respondWith(
55	    caches.match(event.request)
56	    .then((response) => {
57	      if (response) {
58	        return response;
59	      }
60
61	      // 重要：リクエストを clone する。リクエストは Stream なので
62	      // 一度しか処理できない。ここではキャッシュ用、fetch 用と2回
63	      // 必要なので、リクエストは clone しないといけない
64	      let fetchRequest = event.request.clone();
65
66	      return fetch(fetchRequest)
67	      .then((response) => {
68	        if (!response || response.status !== 200 || response.type !== "basic") {
69	          return response;
70	        }
71
72	        // 重要：レスポンスを clone する。レスポンスは Stream で
73	        // ブラウザ用とキャッシュ用の2回必要。なので clone して
74	        // 2つの Stream があるようにする
75	        let responseToCache = response.clone();
76
77	        caches.open(CACHE_NAME)
78	        .then((cache) => {
79	          cache.put(event.request, responseToCache);
80	        });
81	        return response;
82	      });
83	    })
84	  );
85	});
86