服務器報錯 ：
Resolved [org.springframework.web.multipart.support.MissingServletRequestPartException: Required request part 'excelFile' is not present]
瀏覽器報錯：
studentAddByExcel:146 Error: Request failed with status code 400
at e.exports (spread.js:25)
at e.exports (spread.js:25)
at XMLHttpRequest.l.<computed> (spread.js:25)。
前端代碼：
var test1 = new Vue({
el: "#div_UpExcel",
data: {
file: "",
filename: "",
fileUpFlag:false,
msg: "",
msg2: "",
total: "",
successSum: "",
errorSum: "",
errorIf: "",
// ceshi: ""
},
methods: {
getFileName: function (e) {
// alert(e.target.files[0].name)
this.file = e.target.files[0];
var fileType = "";
var result = "";
try {
var fileNameSplit = e.target.files[0].name.split(".");
fileType = fileNameSplit[fileNameSplit.length - 1]
} catch (e) {
fileType = ""
}
var excelList = ['xls', 'xlsx'];
result = excelList.some(function (item) {
return item == fileType;
});
if (result) {
this.msg = "檔案型別正確，可以上傳";
this.fileUpFlag = true;
} else {
this.msg2 = "檔案型別錯誤，僅支持.xls,.xlsx后綴檔案";
this.fileUpFlag = false;
}
},
btn2: function () {
let config = {
responseType: "blob"
};
let formData = new FormData();
// console.log(this.errorIf);
// console.log(JSON.stringify(this.errorIf));
formData.append("errorIf", JSON.stringify(this.errorIf));
axios.post("/download", formData, config)
.then(res => {
const link = document.createElement("a");
let blob = new Blob([res.data], {type: 'multipart/form-data'});
link.style.display = "none";
link.href = URL.createObjectURL(blob);
link.setAttribute("download", decodeURI(res.headers['filename']));
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
})
.catch(error => {
alert("服務器例外！非常抱歉");
console.log(error);
});
},
btn1: function (e) {
if (!this.fileUpFlag) {
alert("請正確選擇上傳檔案！");
} else {
this.msg2 = "檔案正在決議中請稍等";
let formData = new FormData();
formData.append('excelFile', this.file);
console.log(formData.get("excelFile"));
let config = {
headers: {"Content-Type": "multipart/form-data"}
};
axios.post("/excelUp", formData, config).then(response => {
this.total = response.data.total;
this.errorIf = response.data.errorIf;
this.successSum = response.data.successSum;
this.errorSum = response.data.errorSum;
this.msg2 = "檔案決議完成!上傳資料總量：" + this.total + " 成功執行數量：" + this.successSum + " 失敗數量：" + this.errorSum
}).catch(function (error) {
console.log(error)
});
}
e.preventDefault()
}
}
})
<form class="layui-form layui-form-pane" action="excelUp" method="post" enctype="multipart/form-data">
<div class="layui-form-item">
<label class="layui-form-label">EXCEl檔案</label>
<div class="layui-input-inline">
<input type="file" name="file" id="file" @change="getFileName">
<label>{{msg}}</label>
</div>
</div>
<div class="layui-form-item">
<button class="layui-btn" @click="btn1">上傳</button>
</div>
<label>{{msg2}}</label>
<!-- <label>{{ceshi}}</label>-->
</form>
后端代碼：
@ResponseBody
@PostMapping("/excelUp")
public ExcelAnalyzeResult excelUp(@RequestParam("excelFile") MultipartFile multipartFile) {
try {
return rootService.addUserExcel(multipartFile.getInputStream());
} catch (Exception e) {
e.printStackTrace();
}
return null;
}
問題詳情描述：代碼在本地localhost運行時，上傳檔案 在谷歌和火狐均沒問題，但是當部署到華為云之后，用火狐訪問均沒問題，當使用谷歌瀏覽器訪問時，只有當服務器專案啟動之后第一次訪問，百分百正確上傳，之后再點擊上傳時報錯，但是最迷惑的點來了，如果點擊個十幾次上傳，居然偶爾有一兩次能上傳成功，希望各位技術老哥幫忙參考一下，是chrome瀏覽器不支持什么東西嗎？先謝過了
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/62635.html
標籤：JavaScript
上一篇：JavaScript資料型別
下一篇：JavaScript的運算子