使用Giphy的Workbox cachefirst网络请求错误

Question

我正在使用以下策略来缓存图像：

workbox.routing.registerRoute(
    /.*\.(?:png|jpg|jpeg|svg|webp|gif)/,
    new workbox.strategies.CacheFirst({
    "cacheName": "images",
    plugins: [
        new workbox.expiration.Plugin({
          maxEntries: 60, 
          maxAgeSeconds: 2592000, 
          purgeOnQuotaError: false})]
}), 'GET');

我没有定义任何其他特定策略。

[当我在包含Giphy主持的Gif的index.html中尝试时：

<img src="https://media.giphy.com/media/xUA7baWfTjfHGLZc3e/giphy.gif"/>

Worbox确实认为只要我在线，就可以正确缓存”>

使用CacheFirst响应'https://media.giphy.com/media/xUA7baWfTjfHGLZc3e/giphy.gif'

如果我禁用wifi并尝试刷新offline

我的页面，则会遇到以下错误：

Workbox对“ https://media.giphy.com/media/xUA7baWfTjfHGLZc3e/giphy.gif”的网络请求引发了错误。 TypeError：无法提取

未捕获（承诺中）无响应：该策略无法为'https://media.giphy.com/media/xUA7baWfTjfHGLZc3e/giphy.gif'生成响应。潜在的错误是TypeError：无法获取。在CacheFirst.makeRequest（https://storage.googleapis.com/workbox-cdn/releases/4.3.1/workbox-strategies.dev.js:180:15）

获取https://media.giphy.com/media/xUA7baWfTjfHGLZc3e/giphy.gif net :: ERR_FAILED

因此我缺少什么吗？我是否应该配置更多内容以便能够缓存Giphy gif？还是实际上是一个错误？还是无法解决的问题？

任何帮助，谢谢，谢谢

我正在使用以下策略来缓存图像：workbox.routing.registerRoute（/.*\.(?:png|jpg|jpeg|svg|webp|gif)/，新的workbox.strategies.CacheFirst（{ cacheName“：“图像”，...

Answer 1

我的问题是Workbox Cache First not caching properly的重复项>

答案是Diego H Ferraz在https://stackoverflow.com/a/59040270/5404186中提供的答案>