[英]415 (Unsupported Media Type) when uploading files
我想使用 angular js 和 spring boot 上傳文件。
這是我的 java 控制器
//upload Files
@RequestMapping(value="/upload",headers=("content-type=multipart/*"), method=RequestMethod.POST)
public @ResponseBody String handleFileUpload(@RequestParam("name") String name,@RequestParam("file") MultipartFile file){
if (!file.isEmpty()) {
try {
byte[] bytes = file.getBytes();
BufferedOutputStream stream =
new BufferedOutputStream(new FileOutputStream(new File(name)));
stream.write(bytes);
stream.close();
return "You successfully uploaded " + name + "!";
} catch (Exception e) {
return "You failed to upload " + name + " => " + e.getMessage();
}
} else {
return "You failed to upload " + name + " because the file was empty.";
}
}
這是我的表格
<section id="contact-info">
<section id="contact-page">
<div class="container">
<div class="center">
<p class="lead">Import reports</p>
</div>
<div class="row contact-wrap">
<div class="status alert alert-success" style="display: none"></div>
<form id="main-contact-form" class="contact-form" name="contact-form" method="POST" enctype="multipart/form-data" >
<div class="col-sm-5 col-sm-offset-1">
<div class="form-group">
<label>name *</label>
<input type="text" name="name" class="form-control" required="required" ng-model="rap.name">
</div>
<div class="form-group">
<label>file</label>
<input type="file" name="file" class="form-control" ng-model="rap.file">
</div>
<div class="form-group">
<button type="submit" class="btn btn-primary btn-lg" ng-click="upload()">Import File</button>
</div>
</form>
</div><!--/.row-->
</div><!--/.container-->
</section><!--/#contact-page-->
這是我的 js 控制器
//Upload files
$scope.upload=function(rap){
$http.post('http://localhost:8080/upload?name='+$scope.rap.name+"file="+$scope.rap.file ,{
headers: { 'Content-Type': undefined },
transformRequest: angular.identity })
.success(function(){
console.log('Post Succeded !');
})
.error(function(){
console.log('Post Failed .');
});
}
當我填寫表格並單擊 ImportFile 時,出現下面提到的錯誤。有任何想法嗎?
$http.post('http://localhost:8080/uploadname='+$scope.rap.name+"file="+$scope.rap.file ,{
headers: { 'Content-Type': undefined },
transformRequest: angular.identity })
您對該方法的簽名有點錯誤 - 第二個對象是數據,請參閱https://docs.angularjs.org/api/ng/service/ $http#post
"file="+$scope.rap.file
您是否嘗試通過 url 作為多部分對象發布文件內容? 通常文件發布在 http 正文中。
此外,ngModel 不支持綁定到 input[file] 的值,並非所有瀏覽器都支持 javascript 中的 FileAPI - 請參閱例如這個https://github.com/angular/angular.js/issues/1375
因此,如果您需要支持“舊版”瀏覽器,請使用為此目的編寫的第三方 ng 的 polyfill 庫(如建議的 @Uzi Kilon)。
如果您對現代瀏覽器沒問題,則可以添加自定義 input[file] onchange 處理程序以將文件綁定到模型並正確發布到服務器端點。(請參閱AngularJS:如何使用多部分形式實現簡單的文件上傳? )
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.