前端设置multipart form-data

前端设置 `multipart/form-data` 的方法是在 HTML 表单的 `<form>` 标签中添加 `enctype="multipart/form-data"` 属性。该属性指定了表单数据的编码类型为 `multipart/form-data`。例如：

<form action="/upload" method="post" enctype="multipart/form-data">
  <!-- 在这里添加表单元素 -->
</form>

这样设置后，当提交表单时，浏览器会将表单数据以 `multipart/form-data` 的格式进行编码，并将文件数据作为二进制流进行传输，以便服务器能够正确解析上传的文件。

相关问题

html multipart/form-data,【Web前端问题】请求的contentType需要multipart/form-data，怎么转换？...

如果你需要将一个普通的表单数据转换为 `multipart/form-data` 格式，可以使用 `FormData` 对象来实现。具体的步骤如下：

1. 创建一个 `FormData` 对象：`var formData = new FormData();`
2. 向 `formData` 对象中添加普通表单数据：`formData.append('username', '张三');`
3. 向 `formData` 对象中添加文件数据：`formData.append('avatar', file);`（其中 `file` 是一个 `File` 对象）
4. 使用 `XMLHttpRequest` 发送请求，并将 `formData` 对象作为参数传入：`xhr.send(formData);`

此时，`XMLHttpRequest` 会自动将 `formData` 对象转换为 `multipart/form-data` 格式，并将其作为请求体发送到服务器。

封装的api前端post请求form-data

实现前端post请求form-data可以使用FormData对象和XMLHttpRequest对象。以下是示例代码：

const formData = new FormData();
formData.append('username', 'John');
formData.append('password', 'Doe');

const xhr = new XMLHttpRequest();
xhr.open('POST', '/api/login');
xhr.onload = function() {
  if (xhr.status === 200) {
    console.log(xhr.responseText);
  }
};
xhr.send(formData);

在FormData对象中，通过append方法添加需要提交的表单数据。在XMLHttpRequest对象中，设置请求方式为POST，设置请求地址为/api/login，设置请求头为Content-Type: multipart/form-data，然后将FormData对象作为send方法的参数发送请求。

注意，如果需要上传文件，则需要使用<input type="file">元素获取文件，然后使用FormData对象的append方法添加文件数据。同时，需要在send方法调用前设置XMLHttpRequest对象的upload属性的onprogress事件监听上传进度。