时间戳

首页 > 解决方案 > API请求中的`formData.append('files[]', file)`是什么意思？

javascript - API请求中的`formData.append('files[]', file)`是什么意思？

问题描述

我正在重构jQuery 文件上传到Axios。

当 jQuery 文件上传发出请求（上传 jpg 文件）时，我在 Chrome 开发工具中注意到了这种有效负载

在此处输入图像描述

查看源代码

在此处输入图像描述

如果我想制作与Axios中的jQuery 文件上传相同的有效负载，我将不得不这样做：

<input type="file" id="file-selector" />

document.getElementById("file-selector").addEventListener("change", (event) => {
  const formData = new window.FormData();

  formData.append("files[]", event.target.files[0]);

  axios.post(myEndPoint, formData);
});

我不明白的部分是formData.append("files[]", event.target.files[0]);

为什么 jQuery File Upload 使用"files[]"formData 键中的括号？

还是我重构的 Axios 代码有问题？

标签： javascriptjqueryaxiosjquery-file-upload

解决方案

这行代码与 jQuery 无关：

formData.append("files[]", event.target.files[0]);

分解它：

  • formData是对FormData对象的引用。它用于在 AJAX 请求中发送二进制文件数据。
  • 该append()方法用于手动向 FormData 对象添加内容。
  • files[]是放置内容的请求属性的名称。[]键末尾的通常是 PHP 命名约定，指示服务器端从使用相同键名发送的任何内容创建一个数组。
  • event.target.files[0]是被添加到 FormData 对象中该键的二进制内容。

推荐阅读