文件上传：谁负责设置HTTP标头

Question

我试图了解HTTP文件上传的工作原理。

例如，我的VueJS应用正在调用REST API（使用Axios）。调用axios.request时，未设置标题。只有FormData对象包含要上传的文件。

当请求到达后端时，我看到Content-Type: multipart/form-data; ...标头已添加到请求中。

此标头何时创建？谁负责创建标题？

Answer 1

如果是文件上传Ajax请求，则在Axios中，是由浏览器设置的Content-Type: multipart/form-data;...标头。

在Axios源代码lib/adapters/xhr.js（负责XMLHttpRequest的代码）中，将检查HTTP请求数据。如果它是FormData的实例，则Content-Type标头将被删除，并让浏览器完成该工作。

在lib/adapters/xhr.js中（请查看源代码中的注释）：

if (utils.isFormData(requestData)) {
  delete requestHeaders['Content-Type']; // Let the browser set it
}

对于utils.isFormData()，逻辑为：

// code in lib/utils.js
function isFormData(val) {
  return (typeof FormData !== 'undefined') && (val instanceof FormData);
}