Reactjs 如何使用create react应用程序从服务人员中排除某些URL？

我有应用程序使用创建反应应用程序和服务工人生成的一个建设

我查阅了很多问题和文章，但仍然没有找到可用的答案

添加类似urlBlockList的内容以创建react应用程序服务工作者的最佳实践是什么

---

我认为，

react-eject

不是最合适的解决方案

我找到的最佳解决方案-使用 并将不需要的URL添加到自定义软件配置

例如：

---

以下是一个适用于CRA 3的解决方案：

添加到您的项目中，例如：

warn Add react app rewired--save dev

将

package.json的
scripts
部分中的
react脚本
替换为重新布线的
react应用程序

在项目的根目录中放置一个名为

config overrides.js

的文件。在此文件中，您可以向service worker配置添加条目。例如：

---

上面的配置将带有

/oauth2/authorization/

和

/login/oauth2/

的URL从服务人员中排除。

您看过了吗？是的，但是服务人员代码包含非常明确的短语“不要修改此生成的代码”，这就是为什么我认为-这不是最佳实践方式。顺便说一句，这是在创建react应用程序构建过程之后对build/service-worker.js代码进行的Minifeidi自动修改，应该可以。在该文件发布到生产环境后，不会对其进行任何修改。

// sw-config.js
module.exports = {
  runtimeCaching: [
    {
      urlPattern: '/unwantedurl',
      handler: 'networkFirst',
    },
  ],
};

module.exports = function override(config, env) {
  const swPrecacheConfig = config.plugins.find(
     plugin => plugin.constructor.name === "GenerateSW"
  );
  // Prevent some URLs from being cached by the service worker
  const blacklist = swPrecacheConfig.config.navigateFallbackBlacklist;
  blacklist.push(/\/oauth2\/authorization\//);
  blacklist.push(/\/login\/oauth2\//);
  return config;
};