Angular Spring 文件上传

Question

I'm trying to hit the Spring RestController and just getting:

osweb.servlet.PageNotFound : Request method 'POST' not supported

I believe something is missing to map the controller.

<div class="col-sm-1" style="background-color:#cccccc;" align="center"><span class="file-input btn btn-primary btn-file">Import file<input type="file" onchange="angular.element(this).scope().uploadScriptFile(this.files)"></input></span></div>


    $scope.uploadCtrFile = function(files) {
        console.log(">>>>>>>>>>>>>>>>uploadCtrFile");
        var fd = new FormData();
        //Take the first selected file
        fd.append("file", files[0]);
        console.log(">>>>>>>>>>>>>>>>uploadCtrFile angular.toJson: "
                + angular.toJson(fd, 2));

        $http.post('/rest/uploadCtrFile/', fd,{
            withCredentials: true,
            headers: {'Content-Type': undefined },
            transformRequest: angular.identity
        }).success(function(fd, status, headers, config) {
            $scope.success = ">>>>>>>>>>>>>>>>uploadCtrFile Success: "+JSON.stringify({data: fd});
            console.log($scope.success);
        })
        .error(function(fd, status, headers, config) {
            $scope.success = ( "failure message: " + JSON.stringify({data: fd}));
            console.log($scope.success);
        });

    };

The controller looks like...

            @RequestMapping(value = "/uploadCtrFile/", headers = "'Content-Type': 'multipart/form-data'", method = RequestMethod.POST)
            @ResponseBody
            public void uploadCtrFile(MultipartHttpServletRequest request, HttpServletResponse response) {

                Iterator<String> itr=request.getFileNames();

                MultipartFile file=request.getFile(itr.next());

                String fileName=file.getOriginalFilename();
                log.debug(">>>>>>>>>>>>>>>>>>>submitted uploadCtrFile: "+fileName);
        }

The front end shows these messages...

 ">>>>>>>>>>>>>>>>uploadCtrFile angular.toJson: {}" tl1gen.js:607:0
 "failure message: {"data":     {"timestamp":1457380766467,"status":405,"error":"Method Not Allowed","exception":"org.springframework.web.HttpRequestMethodNotSupportedException","message":"Request method 'POST' not supported","path":"/rest/uploadCtrFile/"}}"

What am I missing ?

Answer 1

You send undefined as the value of Content-Type , here:

headers: {'Content-Type': undefined }

But your controller requires the Content-Type with multipart/form-data value:

@RequestMapping(..., headers = "'Content-Type': 'multipart/form-data'", ...)

You should either send the correct Content-Type header in your request, like:

headers: {'Content-Type': 'multipart/form-data'}

or remove the headers options from your controller definition:

@RequestMapping(value = "/uploadCtrFile/", method = RequestMethod.POST)