Gatsby-plugin-offline - 服务工作者拦截表单 POST 请求答案

【问题标题】：Gatsby-plugin-offline - service worker intercepting form POST requestsGatsby-plugin-offline - 服务工作者拦截表单 POST 请求
【发布时间】：2021-06-26 17:14:28
【问题描述】：

我有一个带有 gatsby-plugin-offline 的页面设置。

我终于让一切都脱机工作了（文档有点稀疏，所以这有点“反复试验”）。但我现在有一个我似乎无法解决的问题。

我对 Netlify 的联系表单的 POST 请求被 serviceworker 拦截。我真的不需要任何离线功能——当用户离线时，我简单地将表单中的“发送”按钮“交换”为“网络离线”消息。但是，当页面在线时，serviceworker 仍然会启动。

我想我必须为 POST 请求做一些替代路由，但我不知道如何解决这个问题？

到目前为止，这是我在 gatsby-plugin-offline 中按预期工作的设置：

{
      resolve: "gatsby-plugin-offline",
      options: {
        precachePages: [
          `/index.html`,
          `/en/artikler/*`,
          `/en/artikler/*/*`,
          `/en/`,
          `/artikler/*`,
          `/artikler/*/*`,
          `/webudvikling/*`,
          `/en/webudvikling/*`,
          `/grafik/*`,
          `/en/grafik/*`,
          `/kompetencer/*`,
          `/en/kompetencer/*`,
        ],
        workboxConfig: {
          globPatterns: [
            "**/*{.html,.webp,.webmanifest,.woff,.woff2,.ttf,.eot,.css,.svg,.mp3,icons/icon*,.ico, sw.js}",
          ],
        },
      },
    },

插件的文档意味着可以通过在选项下添加一行来将脚本附加到服务工作者：

appendScript: require.resolve(`./src/custom-sw-code.js`),

然后我的想法是添加如下内容：

workbox.routing.registerRoute(
      /\$?????????/,
      workbox.strategies.networkFirst(),
    )

但我不确定？你能以某种方式过滤 event.request.method === 'POST' 或类似的强制任何 POST 请求只发送到网络吗？

【问题讨论】：

标签： gatsby workbox gatsby-plugin

【解决方案1】：

啊抱歉。这已经在这个帖子的其他地方得到了回答：

Netlify Forms and service worker

简而言之：在每个表单提交的 POST url 中附加一个唯一的 id。这样，Service Worker 将无法拦截响应，因为实际上没有什么要缓存的。

【讨论】：