这篇文章主要介绍了AJAX文件上传功能实现中出现报错Currentrequestisnotamultipartrequest的问题,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
想做一个文件上传,spring boot配合Ajax来进行。却报错:Current request is not a multipart request
这是错误截图:
当时发生这种错误,我是很震惊的,我以为找了很多办法来解决。
有以下办法,当然这些并未解决我的问题,但是部分有用,就先列举出来:
1.在页面头部加入信息:
<meta http-equiv="Content-Type" content="multipart/form-data; charset=utf-8" />
此方法 未解决 问题!
2.在form表单加入属性:enctype
<form method="post" enctype="multipart/form-data">
<input type="file" name="file" />
</form>
此方法 未解决 问题!
3.后端:@RequestParam MultipartFile file 改为 @RequestPart MultipartFile file
此方法 未解决 问题!
还有个别方法。。。都不行
下面是解决方法,我之前的ajax代码:
$('#upload-ok').click(function () {
var form = document.getElementById("upload-form");
var file = new FormData(form);
$.ajax({
url: "/addFile",
type: "POST",
processData:false,
contentType:false,
data:{
"file":file
},
success: function (date) {
xxxxxx
},
error: function (date) {
xxxxxx
}
})
})
正确代码:
$('#upload-ok').click(function () {
var form = document.getElementById("upload-form");
var file = new FormData(form);
$.ajax({
url: "/addFile",
type: "POST",
processData:false,
contentType:false,
//重要部分,data的传的是整个表单,不用大括号包裹;不用自定义变量名
data:file,
success: function (date) {
xxxxxx
},
error: function (date) {
xxxxxx
}
})
})
就这样,解决!!!
到此这篇关于AJAX实现文件上传功能报错Current request is not a multipart request详解的文章就介绍到这了,更多相关AJAX文件上传内容请搜索编程学习网以前的文章希望大家以后多多支持编程学习网!
本文标题为:AJAX实现文件上传功能报错Current request is not a multipart request详解
- 关于 html:如何从 css 表中删除边距和填充 2022-09-21
- 基于CORS实现WebApi Ajax 跨域请求解决方法 2023-02-14
- javascript 判断当前浏览器版本并判断ie版本 2023-08-08
- JS实现左侧菜单工具栏 2022-08-31
- layui数据表格以及传数据方式 2022-12-13
- 深入浅析AjaxFileUpload实现单个文件的 Ajax 文件上传库 2022-12-15
- jsPlumb+vue创建字段映射关系 2023-10-08
- ajax实现输入提示效果 2023-02-14
- 1 Vue - 简介 2023-10-08
- vue keep-alive 2023-10-08