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的形式发送。

我尝试在获取请求上手动设置标头并显式指定表单的encType属性（即使它应该默认为url编码）但它不起作用。

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

Answer 1

来自the spec：

切换对象的类型：

FORMDATA

将操作设置为运行multipart / form-data编码算法的操作，对象为表单数据集，utf-8为显式字符编码。

将Content-Type设置为multipart/form-data;boundary=，然后是multipart / form-data编码算法生成的multipart / form-data边界字符串。

它使用multipart，因为你传递一个FormData对象，这就是fetch对FormData对象的作用。

如果要发送application/x-www-form-urlencoded数据，请手动编码，或使用实现URLSearchParams接口的对象。

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

浏览器强制发送multipart / formdata

1 个答案: