网络化表单和服务辅助角色

Question

我正在尝试在我的网站上设置网络化表单。我指出这个东西不适用于我的服务工作者(即使我只放置基本的软件(。没有软件，一切正常。

Answer 1

您不必取消注册并重新注册您的服务工作线程即可让 netlify 表单随之运行。一种更简单的方法是绕过 SW 缓存，方法是始终将唯一字符串添加到您发布表单的 url。

就我而言，我使用的是浏览器获取方法，而不是让它发布到"/"，而是在 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 一起使用。

Answer 2

Thnx to Netlify 支持 我解决了我的问题。那些家伙是最好的(有一个免费帐户，直到今天他们提供了如此多的帮助真是太棒了(。因为服务工作者劫持表单来请求，这就是为什么 Netlify 没有捕获我提交的任何表单的原因。

溶液：您需要在联系页面上禁用服务工作进程：

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

从现在开始禁用该服务工作线程后，如果要确保服务工作线程在提交后将再次工作，只需将操作添加到将再次注册服务工作线程的成功页面

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