Как я могу кэшировать динамические c URL-адреса в работнике службы? Имеет ли это какое-либо отношение к прекаше? Я использую ReactJS сервис по умолчанию

Question

В моем файле Main. js ниже приведен код:

import * as serviceWorker from './serviceWorker';
/*
some code
*/
ReactDOM.render(<Main />,document.getElementById('app'));
serviceWorker.register()

Этот serviceWorker создан по умолчанию из операции create-response-app, но мне пришлось скопировать его из источника, поскольку я не не создавать приложение с помощью create-реагировать-приложение.

serviceWorker ищет файл «service-worker. js» внутри / scope. В следующей строке:

const swUrl = `/service-worker.js`;

Используя эту конфигурацию, я могу кэшировать все, что упомянуто в сервис-работнике. js Переменная PrecacheConfig файла, такая как /js/app.js

Когда дело доходит до динамического c URL, такого как /myapp/{id}/test/. Я точно знаю, что предварительное кэширование не должно выполняться для всех этих динамических c URL-адресов, и они должны кэшироваться, когда пользователь посещает страницу, но тогда где и как мне их кэшировать?

Answer 1

Я бы порекомендовал использовать Workbox https://developers.google.com/web/tools/workbox для управления функциональностью вашего Service Worker. Используя модуль workbox.routing (https://developers.google.com/web/tools/workbox/modules/workbox-routing), вы можете указать собственные правила обналичивания, указав c в регулярных выражениях своего приложения.

Надеюсь, это поможет вам!