Netlify 表单和服务人员

Question

我正在尝试在我的网站上设置 netlify 表单。我指出这个东西不适用于我的服务人员（即使我只放置基本软件）。没有软件，一切正常。

Answer 1

感谢 Netlify 支持，我解决了我的问题。那里的那些人是最棒的（拥有免费帐户和他们提供的这么多帮助，直到今天真是太棒了）。因为 Service worker 劫持表单来请求，所以 Netlify 没有捕获我的任何表单提交。

解决方法：您需要在联系页面上禁用 service worker：

<script>

  navigator.serviceWorker.getRegistrations().then(function(registrations) 
    {
        for (let registration of registrations) {
            registration.unregister()
        }
    })
</script>

以后service worker将被禁用，如果你想确保service worker在提交后能再次工作，只需在成功页面添加action，再注册service worker

<form name="Netlify Form" method="post" data-netlify="true" action="/send">

Answer 2

您不必注销并重新注册您的 Service Worker 即可获取 netlify 表单运行。一种更简单的方法是通过始终向 url 您 post 您的表单添加唯一字符串来绕过 SW 缓存。

在我的例子中，我使用的是浏览器的获取方法，而不是让它 post 只是“/”，我在 url 中添加了一个时间戳，如下所示：“/?t=1234652736 "

const postUrl = '/?t=' + Math.floor(Date.now() / 1000);

fetch(postUrl, {
    method: 'post',
    headers: {
      'Content-Type': 'application/x-www-form-urlencoded',
    },
    body: ...),
  })

您不必使用 fetch 它也可以通过 axios 与 ajax 一起使用。

Netlify 表单和服务人员

Netlify Forms and service worker

netlify