Spring AngularJS上传文件功能-400错误错误请求错误

Spring AngularJS upload file functionality - 400 error Bad request

本文关键字:错误 -400 请求 功能 文件 AngularJS Spring      更新时间:2023-09-26

我试图使用Spring和AngularJS上传文件,但收到了一个400错误的请求错误:

> error: "Bad Request"
> exception: "org.springframework.web.multipart.support.MissingServletRequestPartException"
> message: "Required request part 'file' is not present."
> path:"/project/ffl/newDocument

我介绍了如何实现功能的不同示例(#1、#2、#3、#4、#5等等),并遵循了所有这些示例。尽管如此,我还是得到了400的错误。

我的请求:

Request URL:https://localhost:8443/project/ffl/newDocument
Request Method:POST
Status Code:400 Bad Request
Remote Address:[::1]:8443
Response Headers
view source
Cache-Control:no-cache, no-store, max-age=0, must-revalidate
Connection:close
Content-Type:application/json;charset=UTF-8
Date:Wed, 16 Dec 2015 18:24:08 GMT
Expires:0
Pragma:no-cache
Server:Apache-Coyote/1.1
Strict-Transport-Security:max-age=31536000 ; includeSubDomains
Transfer-Encoding:chunked
X-Content-Type-Options:nosniff
X-Frame-Options:DENY
X-XSS-Protection:1; mode=block
Request Headers
view source
Accept:application/json, text/plain, */*
Accept-Encoding:gzip, deflate
Accept-Language:en-US,en;q=0.8,uk;q=0.6,ru;q=0.4
Connection:keep-alive
Content-Length:75515
Content-Type:multipart/form-data; boundary=----WebKitFormBoundarylcovac73AQDt1CNW
Host:localhost:8443
Origin:https://localhost:8443
Referer:https://localhost:8443/project/
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/47.0.2526.80 Safari/537.36
X-Requested-With:XMLHttpRequest
Request Payload
------WebKitFormBoundarylcovac73AQDt1CNW
Content-Disposition: form-data; name="file"; filename="test.pdf"
Content-Type: application/pdf

------WebKitFormBoundarylcovac73AQDt1CNW--

HTML:

<form ng-submit="uploadFile()" class="form-horizontal" enctype="multipart/form-data">
   <input type="file" name="file" id="file" ng-model="document.fileInput" onchange="angular.element(this).scope().upload(this)" >
   <button class="btn btn-primary" type="submit">Submit</button>
</form>

JS:

    $scope.document = {};
      var file = {};
      $scope.upload = function(fileInput) {
        file = fileInput;
      };
  $scope.uploadFile = function(){
    var formData = new FormData();
    formData.append("file", file.files[0]);
    $http.post('ffl/newDocument', formData, {
       headers: {'Content-Type': undefined },
       transformRequest: angular.identity
            }).then(function (response) {
            }, function (error) {
                console.error('Error: ', error.status, error.data);
                });
       };

Java:

@RestController
@RequestMapping("/ffl")
@RequestMapping(value="/newDocument", method = RequestMethod.POST, consumes = {"multipart/form-data"})
public @ResponseBody void uploadFile(@RequestPart("file") MultipartFile file) throws IOException {

任何帮助都将不胜感激。

1。列表项更改Spring控制器上的方法以使用此:

    RequestMapping(value = "/newDocument", method = RequestMethod.POST)
    public @ResponseBody Object uploadFiles(MultipartHttpServletRequest request, HttpServletResponse response) throws IOException {
        
        Iterator<String> iterator = request.getFileNames();
        MultipartFile multipartFile = null;
        while (iterator.hasNext()) {
            multipartFile = request.getFile(iterator.next());
            //do something with the file.....
        }
    } 

2。以及您的Angular控制器:

    console.log(files[0]);
    $http.post( '/myEndpoint', formData, {
        headers: { 'Content-Type': undefined },
        transformRequest: angular.identity
    }).success(function (result) {
        console.log('Success');
    }).error(function () {
        console.log('Failure');
    });  

3。您应该具有以下依赖项:

commons文件上传

4。在servlet配置.xml 中添加此bean

    <bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver" />