ソースを参照

sw add and register, start working with cashe

serg1557733 1 年間 前
コミット
56d606aa80

+ 99 - 0
frontend/public/service-worker.js

@@ -0,0 +1,99 @@
+console.log('start')
+
+const CASH = 'ver-1'
+const urlsToCash = ['index.html', 'offline.html']
+
+const self = this;
+
+self.addEventListener('install', (e) => {
+  console.log('self wait..')
+      e.waitUntil(
+        caches.open(CASH)
+          .then( cache => {
+          console.log('open cash', cache)
+
+          return cache.addAll(urlsToCash)
+          })
+    )
+})
+
+self.addEventListener('fetch', () => {
+  
+})
+
+
+self.addEventListener('activate', () => {
+  
+})
+// /* eslint-disable no-restricted-globals */
+
+// // This service worker can be customized!
+// // See https://developers.google.com/web/tools/workbox/modules
+// // for the list of available Workbox modules, or add any other
+// // code you'd like.
+// // You can also remove this file if you'd prefer not to use a
+// // service worker, and the Workbox build step will be skipped.
+
+// import { clientsClaim } from 'workbox-core';
+// import { ExpirationPlugin } from 'workbox-expiration';
+// import { precacheAndRoute, createHandlerBoundToURL } from 'workbox-precaching';
+// import { registerRoute } from 'workbox-routing';
+// import { StaleWhileRevalidate } from 'workbox-strategies';
+
+// clientsClaim();
+
+// // Precache all of the assets generated by your build process.
+// // Their URLs are injected into the manifest variable below.
+// // This variable must be present somewhere in your service worker file,
+// // even if you decide not to use precaching. See https://cra.link/PWA
+// precacheAndRoute(self.__WB_MANIFEST);
+
+// // Set up App Shell-style routing, so that all navigation requests
+// // are fulfilled with your index.html shell. Learn more at
+// // https://developers.google.com/web/fundamentals/architecture/app-shell
+// const fileExtensionRegexp = new RegExp('/[^/?]+\\.[^/]+$');
+// registerRoute(
+//   // Return false to exempt requests from being fulfilled by index.html.
+//   ({ request, url }) => {
+//     // If this isn't a navigation, skip.
+//     if (request.mode !== 'navigate') {
+//       return false;
+//     } // If this is a URL that starts with /_, skip.
+
+//     if (url.pathname.startsWith('/_')) {
+//       return false;
+//     } // If this looks like a URL for a resource, because it contains // a file extension, skip.
+
+//     if (url.pathname.match(fileExtensionRegexp)) {
+//       return false;
+//     } // Return true to signal that we want to use the handler.
+
+//     return true;
+//   },
+//   createHandlerBoundToURL(process.env.PUBLIC_URL + '/index.html')
+// );
+
+// // An example runtime caching route for requests that aren't handled by the
+// // precache, in this case same-origin .png requests like those from in public/
+// registerRoute(
+//   // Add in any other file extensions or routing criteria as needed.
+//   ({ url }) => url.origin === self.location.origin && url.pathname.endsWith('.png'), // Customize this strategy as needed, e.g., by changing to CacheFirst.
+//   new StaleWhileRevalidate({
+//     cacheName: 'images',
+//     plugins: [
+//       // Ensure that once this runtime cache reaches a maximum size the
+//       // least-recently used images are removed.
+//       new ExpirationPlugin({ maxEntries: 50 }),
+//     ],
+//   })
+// );
+
+// // This allows the web app to trigger skipWaiting via
+// // registration.waiting.postMessage({type: 'SKIP_WAITING'})
+// self.addEventListener('message', (event) => {
+//   if (event.data && event.data.type === 'SKIP_WAITING') {
+//     self.skipWaiting();
+//   }
+// });
+
+// Any other custom service worker logic can go here.

+ 0 - 6
frontend/src/reducers/socketReducer.js

@@ -94,12 +94,6 @@ export const getUserSocketSlice = createSlice({
         getUsersOnline: (state, action) => {state.usersOnline = action.payload},
         getAllUsers: (state, action) => {state.allUsers = action.payload},
         addNewMessage: (state, action) => {state.newMessages.push(action.payload)}, 
-
-        // writing: (state, action) => {
-        //                             state.writing = true;
-        //                             state.usersWriting.push(action.payload)                  
-        //     }
-        
         }
     }
 );

+ 1 - 0
frontend/src/service-worker.js

@@ -1,3 +1,4 @@
+
 /* eslint-disable no-restricted-globals */
 
 // This service worker can be customized!

+ 25 - 38
frontend/src/serviceWorkerRegistration.js

@@ -9,22 +9,23 @@
 
 // To learn more about the benefits of this model and instructions on how to
 // opt-in, read https://cra.link/PWA
-const isLocalhost = Boolean(
-  window.location.hostname === 'localhost' ||
-    window.location.hostname === '192.168.0.109' ||
-      // [::1] is the IPv6 localhost address.
-      window.location.hostname === '[::1]' ||
-      // 127.0.0.0/8 are considered localhost for IPv4.
-      window.location.hostname.match(/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/)
-  );
+const isLocalhost = true
+
+// Boolean(
+//   window.location.hostname === 'localhost' ||
+//     window.location.hostname === '192.168.0.109' ||
+//       // [::1] is the IPv6 localhost address.
+//       window.location.hostname === '[::1]' ||
+//       // 127.0.0.0/8 are considered localhost for IPv4.
+//       window.location.hostname.match(/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/)
+//   );
 
   export function register(config) {
-   // console.log('registering..', navigator)
     if ('serviceWorker' in navigator) {
-      //console.log('registering..', navigator)
-
+      console.log('registering..')
       // The URL constructor is available in all browsers that support SW.
       const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);
+      console.log(publicUrl)
       if (publicUrl.origin !== window.location.origin) {
         // Our service worker won't work if PUBLIC_URL is on a different origin
         // from what our page is served on. This might happen if a CDN is used to
@@ -35,22 +36,7 @@ const isLocalhost = Boolean(
       window.addEventListener('load', () => {
         const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
         console.log(swUrl, config)
-        if (isLocalhost) {
-          // This is running on localhost. Let's check if a service worker still exists or not.
-          checkValidServiceWorker(swUrl, config);
-  
-          // Add some additional logging to localhost, pointing developers to the
-          // service worker/PWA documentation.
-          navigator.serviceWorker.ready.then(() => {
-            console.log(
-              'This web app is being served cache-first by a service ' +
-                'worker. To learn more, visit https://cra.link/PWA'
-            );
-          });
-        } else {
-          // Is not localhost. Just register service worker
-          registerValidSW(swUrl, config);
-        }
+        registerValidSW(swUrl, config);
       });
     }
   }
@@ -59,6 +45,7 @@ const isLocalhost = Boolean(
     navigator.serviceWorker
       .register(swUrl)
       .then((registration) => {
+        console.log('registration...')
         registration.onupdatefound = () => {
           const installingWorker = registration.installing;
           if (installingWorker == null) {
@@ -127,14 +114,14 @@ const isLocalhost = Boolean(
       });
   }
   
-  export function unregister() {
-    if ('serviceWorker' in navigator) {
-      navigator.serviceWorker.ready
-        .then((registration) => {
-          registration.unregister();
-        })
-        .catch((error) => {
-          console.error(error.message);
-        });
-    }
-  }
+  // export function unregister() {
+  //   if ('serviceWorker' in navigator) {
+  //     navigator.serviceWorker.ready
+  //       .then((registration) => {
+  //         registration.unregister();
+  //       })
+  //       .catch((error) => {
+  //         console.error(error.message);
+  //       });
+  //   }
+  // }