springboot vue文件无法上传
postman测试后端能上传
后端
@PostMapping(value = "/upload")
public void uploadFile(@RequestParam("files") MultipartFile files) throws IOException, InterruptedException {
if (files.isEmpty()) {
// return "未选择文件";
}
String filename = files.getOriginalFilename();
String path = "C:\\Users\\x\\Desktop\\";
System.out.println(path+""+filename);
files.transferTo(new File(path+filename));
System.out.println("====================执行完==============================");
}
前端
<a-upload
style="margin-left: 30px"
name="file"
:multiple="true"
:headers="headers"
@change="handleChange"
>
<a-button> <a-icon type="upload" /> 上传a-button>
a-upload>
// 上传文件
handleChange(res){
this.files = res.files
var formData = new FormData()
formData.append('files', res.files)
getBackupUpload(formData).then((res) => {
if (res.code === 200) {
this.prompt = '正确文件'
this.status = true
} else{
this.prompt = res.message
this.status = false
}
})
},
/**
* 上传
*/
export function getBackupUpload(files) {
return axios({
url: 'main/selectBackup/upload',
method: 'post',
headers: {
'content-Type': 'multipart/form-data'
},
data: files
})
}
会报错 Required request part ‘files‘ is not present
个人建议先用postman测试一下接口,如果接口没错,那就是前端有问题
因为这个分辨不了哪里得问题
目测 传文件的方式不一样,前端用的表单,检查下postman是不是用了其他的文件流方式上传的
注解换一下@RequestPart ?
这篇文章讲的很详细,请看:SpringBoot + Vue 实现文件的上传与下载@RequestParam 应该要改成。@RequestBody 吧?
name="file" 改成 name="files" , data: files可以去掉
注意字段,file和files是不一样的
传参方式是错的