Блог

Главная - Вопросы по программированию - Кэширование во время выполнения Workbox не работает с URL с параметром запроса?

Кэширование во время выполнения Workbox не работает с URL с параметром запроса?

#javascript #progressive-web-apps #workbox

#javascript #progressive-веб-приложения #workbox

Вопрос:

У меня есть общедоступная конечная точка API, подобная этой:

https://data.weather.gov.hk/weatherAPI/opendata/weather.php?dataType=warnsumamp;lang=en

И я хочу, чтобы время выполнения кэшировало его ответ с помощью service worker. Вот как я определил маршрут:

 registerRoute(
  new RegExp('. /weatherAPI/opendata/weather.php?dataType=warnsumamp;lang=en'),
  new StaleWhileRevalidate({
    cacheName: 'weatherApi',
    plugins: [
      new ExpirationPlugin({
        maxAgeSeconds: 60 * 60 * 24
      }),
      new BackgroundSyncPlugin('getWeatherAPI', {
        maxRetentionTime: 24 * 60 // Retry for max of 24 Hours (specified in minutes)
      })
    ]
  })
)

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

Ответ №1:

Параметры запроса включаются при выполнении RegExpRoute сопоставления в Workbox.

Я думаю, что более вероятно, что вам нужно экранировать символы, которые являются «особыми» в регулярном выражении, например ? .

Использование чего-то другого, кроме регулярного выражения, на самом деле может быть проще. Вы можете использовать matchCallback , например, как:

 registerRoute(
  ({url}) => url.href.endsWith('/weatherAPI/opendata/weather.php?dataType=warnsumamp;lang=en'),
  new StaleWhileRevalidate({...}),
)

Комментарии:

1. Спасибо, Джефф, это делает свое дело. Еще один вопрос: после того, как я сохранил его в кэше, будет ли service worker автоматически перехватывать и отменять мой запрос, если он сделан до истечения срока действия кэша? Нужно ли мне писать какой-либо код для такого поведения?

2. Потому что я все еще вижу, что запрос отправляется после кэша. Это из-за политики кэширования StaleWhileRevalidate ?

3. Да, если вы используете StaleWhileRevalidate , всегда будет сделан сетевой запрос. Вы могли бы попробовать CacheFirst ExpirationPlugin вместо этого, если хотите избежать сетевого запроса до истечения срока действия.