向服务器发送一个简单的表单

Question

这里有一些关于表单的技术性很强的帖子，但它们没有解决我的问题。我正在尝试在请求正文中发送一些表单数据。

我知道这些选项：

只需提交表单，
使用 fetch + DataForm 或 XHR 对象

第一种方法刷新页面，第二种方法默认发送更复杂的编码。此编码不由 Express 中的 bodyParser 中间件处理。

最后的选择是通过 Id 获取每个字段的值，并将其作为对象发送。

有什么方法可以避免编写一些代码行来通过 Id 获取每个元素，或者这可能是正确的方法？

Answer 1

使用 FormData 是从表单获取数据的最简单方法，但它以 multipart/form-data 形式发送数据，您的中间件无法处理。
您可以使用像 multer 这样的中间件来处理这种类型的数据。
如果不能使用multer，可以从FormData对象中取出数据，放到一个URLSearchParams对象中发送数据。

var form = document.getElementById('form');
form.addEventListener('submit', function(e){
  e.preventDefault();
  var formData = new FormData(this);
  var data = new URLSearchParams(formData);
  fetch('',{
    method: 'POST',
    body: data
  });
});

<form id="form">
Name: <input name="name">
Box: <input type="checkbox" name="box" value="box">
<button>Submit</button>
</form>

向服务器发送一个简单的表单

Sending a simple form to server

forms

fetch

dataform

express