Как кэшировать Ejs и создавать прогрессивное веб-приложение с Nodejs - PullRequest
0 голосов
/ 03 февраля 2019

Я использую Nodejs и EJs в качестве движка шаблонов для Node.Я новичок в PWA и хочу создать прогрессивное веб-приложение и хочу кэшировать все мои файлы шаблонов ejs в кеше браузера.Как я могу это сделать?Будет ли работать автономно или нет?Я попытался сделать это, и работник службы успешно зарегистрирован.Он также кэширует файлы, но когда я запускаю его в автономном режиме, он автоматически удаляет кеш при получении.Может кто-то помочь мне с этим?Я запускаю его на локальном хосте: 5000 с сервера узла.

Структура каталогов

 App/
  - css/
  - images/
  - res/
  - sw1.js 
  - uploads/
  - views/
       -partials/
          -footer.ejs
       -index.ejs
       -login.ejs

Файл footer.ejs

     if ('serviceWorker' in navigator) {
         navigator.serviceWorker.register('./sw1.js')
            .then(() => console.log('Service worker Registered'))
            .catch((error) => console.log('some error occurred',error));
        }

Файл sw1.js

var cacheName = 'app-cache';

self.addEventListener('install', function(event) {
  event.waitUntil(
    caches.open(cacheName).then(function(cache) {
      return cache.addAll([./css/main.css', './views/login.ejs', '/']);
    })
  );
  console.log('Service Worker Installed');
});

self.addEventListener('activate', function(e) {
  console.log('[Service Worker] Activate');
  e.waitUntil(
    caches.keys().then(function(keyList) {
      return Promise.all(
        keyList.map(function(key) {
          if (key != cacheName) {
            console.log('Removing old cache', key);
            return caches.delete(key);
          }
        })
      );
    })
  );
});

self.addEventListener("fetch", function(event){
    if(event.request.url.startsWith("http://localhost:5000/")){
        console.log("[Service Worker] Fetch", event.request.url);
        caches.open(cacheName).then(function(cache){
            return fetch(event.request).then(function(response){
                cache.put(event.request, response.clone());
                return response;
            })
         })
    }
    else{
    event.respondWith(
        caches.match(event.request).then(function(response){
            return response || fetch(event.request);
        })
    );
}
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...