Как кэшировать все URL, такие как / page / id, где id - это число, используя рабочий ящик - PullRequest
0 голосов
/ 09 октября 2018

Учитывая следующий фрагмент кода с моего сервера nodejs:

 router.get('/page/:id', async function (req, res, next) {
 var id = req.params.id;
 if ( typeof req.params.id === "number"){id = parseInt(id);}
 res.render('page.ejs' , { vara:a , varb:b });
 });

Я хочу делать именно то, что я делаю на сервере nodejs, но только из сервисного работника.Я сгенерировал и скомпоновал его, используя рабочий ящик, но я не знаю, как кешировать все URL-адреса, такие как / page / 1 или / page / 2 или .... / page / 4353 и т. Д., Не перегружая исходный код сервисного работника.

Код nodejs сверху работает на 100%.Я попытался сделать что-то вроде:

.....{
"url": "/page/\*",
"revision": "q8j4t1d072f2g6l5unc0q6c0r7vgs5w0"
},....

Это не работает в предварительном кэше работника сервиса, когда я перезагружал сайт с этим кодом, добавленным в сервис работника, который он устанавливал, и это заняло довольно много времени.Это нормально?Разве я не могу сделать это, не перегружая весь процесс установки и кеш-память браузера?

Спасибо за помощь!

РЕДАКТИРОВАТЬ:

Мой работник службы выглядит так:

 importScripts("https://storage.googleapis.com/workbox-cdn/releases/3.6.2/workbox-sw.js");

 if (workbox) {
   console.log('Workbox status : ONLINE');
 } else {
   console.log('Workbox status : OFFLINE');
 }

 workbox.skipWaiting();
 workbox.clientsClaim();

 self.__precacheManifest = [
   {
     "url": "/",
     "revision": "7e50eec344ce4d01730894ef1d637d4d"
   },
   'head.ejs',
   'navbar.ejs',
   'map_script.ejs',
   'scripts.ejs',
   'details.json',
   'page.ejs',
   'home.ejs',
   'map.ejs',
   'about.ejs',
   {
     "url": "/page",
     "revision": "881d8ca1f2aacfc1617c09e3cf7364f0",
     "cleanUrls": "true"
   },
   {
     "url": "/about",
     "revision": "11d729194a0669e3bbc938351eba5d00"
   },
   {
     "url": "/map",
     "revision": "c3942a2a8ac5b713d63c53616676974a"
   },
   {
     "url": "/getJson",
     "revision": "15c88be34ben24a683f7be97fd8abc4e"
   },
   {
     "url": "/getJson1",
     "revision": "15c88be34bek24a6l3f7be97fd3aoc4e"
   },
   {
     "url": "/getJson2",
     "revision": "15c82be34ben24a683f7be17fd3amc4e"
   },
   {
     "url": "/getJson3",
     "revision": "15c62be94ben24a683f7be17gd3amc4r"
   },
   {
     "url": "/getJson4",
     "revision": "15c62beh4ben24a6g3f7be97gd3amc4p"
   },
   {
     "url": "/public/_processed_/2/7/csm.jpg",
     "revision": "15c62beh4bek44a6g3f7ben7gd3amc4p"
   },
   {
     "url": "/public/_processed_/2/7/csm.jpg",
     "revision": "15c62beh4ben24a6g3f7be9ngd3a2c4p"
   }
 ].concat(self.__precacheManifest || []);
 workbox.precaching.suppressWarnings();
 workbox.precaching.precacheAndRoute(self.__precacheManifest, {});

Ответы [ 2 ]

0 голосов
/ 11 октября 2018

Идея, лежащая в основе предварительного кэширования, заключается в кэшировании минимального набора веб-ресурсов, необходимых для запуска и запуска вашей страницы, во время установки работника сервиса.Обычно он не используется для кэширования целой пачки данных.

Вам, вероятно, понадобится динамический кеш:

workbox.routing.registerRoute(
  \/page/g,
  workbox.strategies.CacheFirst({
    cacheName: 'my-cache',
  })
);

В этом случае первое попадание получит страницу изсеть.После этого он будет обслуживаться из кеша.

0 голосов
/ 10 октября 2018

Рабочий сервис Workbox имеет свой собственный процесс кэширования.

На основе документации Предварительное кэширование Workbox :

Одной из функций сервисных работников является возможностьсохранить набор файлов в кеш при установке сервисного работника.Это часто упоминается как « precaching », поскольку вы кэшируете контент перед использованием работника службы.

Метод precacheAndRoute устанавливает неявный сначала кэшобработчик.Вот почему домашняя страница загружалась, когда мы были в автономном режиме, хотя мы не написали обработчик выборки для этих файлов.

Если запрос не соответствует предкешированию , мы 'Я добавлю .html в конце, чтобы поддерживать «чистые» URL (иначе говоря, «красивые» URL).Это означает, что запрос, подобный /about, будет соответствовать /about.html.

workbox.precaching.precacheAndRoute(   
  [
    '/styles/index.0c9a31.css',
    '/scripts/main.0d5770.js',
    { url: '/index.html', revision: '383676' },   
  ],   
    {
     cleanUrls: true,   
    } 
);

. Вы можете попробовать реализовать этот метод кэширования файлов с помощью сервисного работника :

cache.addAll (запросы) - Этот метод аналогичен add, за исключением того, что он принимает массив URL-адресов и добавляет их в кэш.Если какой-либо из файлов не может быть добавлен в кэш, вся операция завершится неудачно, и ни один из файлов не будет добавлен.

Для получения дополнительной информации:

...