javascript - 浏览器强制发送multipart/formdata

Question

我正在使用 fetch API 从浏览器发送发布请求。这是我的代码:

const headers = new Headers();
headers.append("Content-Type", "application/x-www-form-urlencoded");

fetch('/signup', {
  method: 'POST',
  body: new FormData(document.querySelector('form')),
  credentials: 'same-origin',
  headers
}).then(
  response => response.text()
).then(
  text => console.log(text)
);

我的表单仅包含文本、电子邮件和密码输入类型。我期望表单数据以内容类型 application/x-www-form-urlencoded 发送，但它以 multipart/formdata 形式发送。

我尝试手动设置获取请求的 header 并显式指定表单的 encType 属性(即使默认情况下它应该是 url 编码的)，但它不起作用。

Chrome 和 Safari 上都会发生这种情况。我可以使用 JSON 轻松解决这个问题，但我真的想知道为什么会发生这种情况!

Answer 1

来自the spec :

Switch on object's type:

FormData

Set action to an action that runs the multipart/form-data encoding algorithm, with object as form data set and with utf-8 as the explicit character encoding.

Set Content-Type to multipart/form-data;boundary=, followed by the multipart/form-data boundary string generated by the multipart/form-data encoding algorithm.

它使用多部分，因为您正在传递 FormData 对象，这就是 fetch 对 FormData 对象所做的事情。

<小时/>

如果您想发送 application/x-www-form-urlencoded 数据，请手动对其进行编码或使用实现 URLSearchParams 接口(interface)的对象。

不过你不应该需要这样做。 multipart/form-data 是一个标准，我从未遇到过无法处理它的表单数据解析库。您应该遇到的唯一负面影响是，它会使请求占用更多字节。