在 create-react-app 服务工作者中缓存跨域 API 调用答案

【问题标题】：Caching cross-origin API calls in create-react-app service worker在 create-react-app 服务工作者中缓存跨域 API 调用
【发布时间】：2020-05-21 06:15:53
【问题描述】：

我正在尝试将 React Web 应用程序转换为 PWA（渐进式 Web 应用程序）。我已经在 index.js 文件中进行了更改 - serviceWorker.register();。

这很好，因为我可以在离线模式下看到主页和资产。但我也想缓存跨源的 API 调用。

我读到create-react-app docs 说

默认情况下，生成的 Service Worker 文件不会拦截或缓存任何跨域流量，例如 HTTP API 请求、图像或从不同域加载的嵌入。

我在文档中找不到更改此默认行为和拦截/缓存跨域 API 调用的方法。

我偶然发现了来自 2017 的this 问题，关于类似的问题，解决方案似乎涉及eject。

自从上述问题过去了一段时间，是否有任何新方法可以使用create-react-app service worker 拦截或缓存任何跨域流量而不弹出？

【问题讨论】：

@Wiyanto Tan 提出的解决方案能解决问题吗？
@Fi3，没用

标签： javascript reactjs create-react-app service-worker

【解决方案1】：

我以前从未这样做过，但您可以尝试在 serviceWorker.js 文件中注释此条件：

【讨论】：

将尝试并确认。