上传前端传递一个from data 的file
时间: 2023-05-12 14:01:10 浏览: 73
前端上传文件时,通常需要使用<form>元素和<input type="file">元素构建一个包含file的表单。用户在选择文件后,点击提交按钮触发表单提交事件,浏览器将把选择的文件以multipart/form-data的方式编码并发送到服务器。
当需要通过AJAX方式上传文件时,可以通过FormData对象方便地构建一个包含file的表单数据。可以通过FormData的append()方法添加多个文件或其他表单元素,然后使用XMLHttpRequest对象发送请求。
示例代码如下:
// 创建一个FormData对象
var formData = new FormData();
// 获取file input元素
var fileInput = document.getElementById('myFile');
// 添加文件到formData
formData.append('myfile', fileInput.files[0]);
// 创建XMLHttpRequest对象
var xhr = new XMLHttpRequest();
// 监听readyStateChange事件
xhr.onreadystatechange = function() {
if(xhr.readyState === 4 && xhr.status === 200) {
console.log(xhr.responseText);
}
};
// 发送POST请求
xhr.open('POST', '/upload', true);
xhr.send(formData);
这样就能轻松地通过AJAX上传文件了。