axios 发送带有数据的文件 - Javascript

Axios 是一个基于 promise 的HTTP客户端工具，可以用于浏览器和 Node.js。可以在浏览器中发送 XMLHttpRequests 请求， 也可以在 node.js 中发送 HTTP请求并支持 Promise API。

在前后端交互中，有时候需要上传文件。这时候就需要用到 FormData 对象，它允许把数据编码成 key/value 的形式，并支持文件上传。下面是一个实例。

示例代码

const formData = new FormData();
formData.append('file', fileInputElement.files[0]);
axios.post(url, formData, {
  headers: {
    'Content-Type': 'multipart/form-data'
  }
}).then(response => {
  console.log(response);
}).catch(error => {
  console.log(error);
});

以上代码中，通过实例化 FormData 对象，把文件数据编码成 key/value 的形式。其中，fileInputElement.files[0] 为文件输入框选择的文件对象。然后使用 axios.post 方法发送 HTTP POST 请求。

需要设置请求头 'Content-Type': 'multipart/form-data' 以指示服务器该请求为文件上传类型。

总结

以上就是使用 Axios 发送带有数据的文件的简单介绍。在实际开发中，我们可以通过这种方式，方便快捷地上传文件数据到服务器，并得到服务器的响应结果。