问题遇到的现象和发生背景
本人是初学者，代码是粘来粘去弄的，只是想做一个上传图片的前后端界面，我前端的表单用的提交方式也是post，ajax也设置post了，后端接收也是postmapping（后来直接改的Requestmapping），为什么前端的数据还是传不到后台？前端直接卡在cannot post了，我不知道哪里还出了问题，谁能教教我吗？感谢！
问题相关代码，请勿粘贴截图
后端的（只粘贴controller了）：
@Controller
@ResponseBody
public class FileController {
@Autowired
private FileService fileService;
@RequestMapping("/uploadFile")
public String uploadFile(MultipartFile file,MultipartFile fileImage,String title){
try {
String result = fileService.uploadFile(file,fileImage,title);
return "index2";
} catch (Exception e) {
e.printStackTrace();
return "失败";
}
}
}
前端的：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="multipart/form-data; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>test</title>
<!-- Bootstrap -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" rel="stylesheet">
<style>
html,body{
height: 100%;
width: 100%;
margin: 0 auto;
}
.titleClass{
margin-top:8px;
color: white;
font-weight: bolder;
}
.timeClass{
margin-top: 25px;
margin-bottom: 10px;
color: grey;
font-size: 14px;
}
.contentTd{
padding-left: 10px;
padding-right: 10px;
width: 150px!important;
height: 150px;
}
tr{
margin-top: 10px;
margin-bottom: 60px;
display: block;
}
.buttonP{
padding-top: 20px;
}
.imageTd{
width: 267px!important;
height: 150px;
}
.imageTd img{
width: 100%;
height: 100%;
}
</style>
</head>
<body>
<script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"></script>
<div class="modal-body">
<form enctype="multipart/form-data" method="post" action="/uploadFile" name="uploadForm" id="uploadForm">
<div class="form-group">
<label for="exampleInputEmail1">文件标题</label>
<input type="text" class="form-control" id="exampleInputEmail1" placeholder="文件标题" name="title">
</div>
<div class="form-group">
<label for="exampleInputFile">文件</label>
<input type="file" id="exampleInputFile" name="file">
<p class="help-block">上传文件</p>
</div>
<div class="form-group">
<label for="exampleInputFile">文件封面</label>
<input type="file" id="fileImage" name="fileImage">
<p class="help-block">上传文件封面</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
<button type="submit" id="filesubmit" class="btn btn-primary">提交</button>
</div>
</form>
<script>
$("#filesubmit").click(function(){
var formData = new FormData();
formData.append("file",document.getElementById("exampleInputFile").file[0]);
formData.append("fileIamge",document.getElementById("fileImage").file[0]);
formData.append("title",document.getElementById("exampleInputEmail1"));
$.ajax({
type:"POST",
url: "/uploadFile",
data: fromData,
cache: false,
processData: false, // 告诉jQuery不要去处理发送的数据
contentType: false, // 告诉jQuery不要去设置Content-Type请求头
success: function (data) {
},
error : function(XMLHttpRequest, textStatus, errorThrown) {
}
});
});
</script>
</body>
</html>
运行结果及报错内容
前端报错就是cannot post，后端就是java.lang.NullPointerException空指针
我的解答思路和尝试过的方法
一开始我都不是用的ajax传输，就用的js表单，传不上去；现在用了ajax，还是不行。请各位指点我一下吧，感激不尽！！
