Service Worker：如何使用Workbox缓存不具有扩展名的图像

Question

我是我的页面上的服务工作者新手，我的图像没有扩展名 [*。jpg，*。png等] ，例如“ $('#charityimgSizer').attr('src', 'path/to/img' + thisId + '.jpg'); ”，我可以从中获取它们API。

以下代码可以正常工作，但不适用于此类图像

www.domain.com/api/media/a2b93f21-1acf-4e5e-9b19-6d7c68aaadc2

有任何建议吗？

Answer 1

带有工作箱的manual-

  

您可以使用RequestDestination的枚举类型   确定策略的请求的目的地。例如，当   目标是数据

：

workbox.routing.registerRoute(
  // Custom `matchCallback` function
  ({event}) => event.request.destination === 'image',
  new workbox.strategies.CacheFirst({
    cacheName: 'image',
    plugins: [
      new workbox.expiration.Plugin({
        maxEntries: 20,
        maxAgeSeconds: 7 * 24 * 60 * 60, // 1 week
      }),
    ],
  })
);

在普通的香草服务人员中，您可以检查request accept header

if (request.headers.get('Accept').indexOf('image') !== -1) { 
    ... stash in cache ...
}