上传文件时出错：当前请求不是spring 4和angular js中的多部分请求答案

【问题标题】：Getting error while uploading file : The current request is not a multipart request in spring 4 and angular js上传文件时出错：当前请求不是spring 4和angular js中的多部分请求
【发布时间】：2018-03-06 19:52:24
【问题描述】：

我使用的是 spring 4 和 angularjs，因为 multipart 使用了 commons-fileupload-1.3.2.jar 和 commons-io-2.4.jar 上传文件时出现错误“org.springframework.web.multipart.MultipartException：当前请求不是多部分请求”

application-servlet.xml 有条目：

<bean id="multipartResolver"  class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
    <property name="maxUploadSize" value="20971520" /> 
</bean>

html 文件：`

<div class="padding-5 border-1">
    <input type="file" id="uploadFileName" 
           size="60" class="filestyle width100per"
           data-icon="false" file-model="importIdeaFile"
           name="filename" required>
</div>`

角度控制器：

$scope.saveFile = function(){
     var filename = $scope.importIdeaFile.name;
             var formdata = new FormData();
       if(typeof $scope.importIdeaFile != 'undefined' && $scope.importIdeaFile != null && $scope.importIdeaFile !=''){
              formdata.append("file",$scope.importIdeaFile);
                     formdata.append('data',new Blob([JSON.stringify($scope.uploadPopupData)], {
                type: "application/json"
            }));$http.post('loginData/uploadIdeafile',formdata,{headers: {'Content-Type': undefined}})
                    .then(
                            function(response,status) {
                                alert(status);  
                            },
                            function(errResponse) {
                                alert(" Error while fetching User");
                            });        
       }
 }`

弹簧控制器：

@RequestMapping(value = "/uploadIdeafile", method = RequestMethod.POST, produces = "application/json")
public String uploadIdeafile(@RequestPart("file") MultipartFile formdata,
              HttpServletRequest request) {
       String methodName = "uploadIdeafile(@RequestBody MultipartFile formdata, HttpServletRequest request)";
       String message = "true";
       return message;}

创建目录：

WebApp.directive('fileModel', ['$parse', function ($parse) {
return {
    restrict: 'A',
    link: function(scope, element, attrs) {
        var model = $parse(attrs.fileModel);
        var modelSetter = model.assign;
        element.bind('change', function(){
            scope.$apply(function(){
                modelSetter(scope, element[0].files[0]);
            });
        });
    }
};}]);

【问题讨论】：

您的问题或问题是什么？
上传文件时出现错误“org.springframework.web.multipart.MultipartException：当前请求不是多部分请求”

标签： angularjs spring

【解决方案1】：

我在 http 调用中添加“transformRequest: angular.identity”并解决了问题

$scope.saveFile = function(){
 var filename = $scope.importIdeaFile.name;
         var formdata = new FormData();
   if(typeof $scope.importIdeaFile != 'undefined' && $scope.importIdeaFile != null && $scope.importIdeaFile !=''){
          formdata.append("file",$scope.importIdeaFile);
                 formdata.append('data',new Blob([JSON.stringify($scope.uploadPopupData)], {
            type: "application/json"
        }));$http.post('loginData/uploadIdeafile',formdata,{headers: {'Content-Type': undefined}})
                .then(
                        function(response,status) {
                            alert(status);  
                        },
                        function(errResponse) {
                            alert(" Error while fetching User");
                        });        
   }

新代码：

$scope.saveFile = function(){
 var filename = $scope.importIdeaFile.name;
         var formdata = new FormData();
   if(typeof $scope.importIdeaFile != 'undefined' && $scope.importIdeaFile != null && $scope.importIdeaFile !=''){
          formdata.append("file",$scope.importIdeaFile);
                 formdata.append('data',new Blob([JSON.stringify($scope.uploadPopupData)], {
            type: "application/json"
        }));$http.post('loginData/uploadIdeafile',formdata,{
             transformRequest: angular.identity,
             headers: {'Content-Type': undefined}})
                .then(
                        function(response,status) {
                            alert(status);  
                        },
                        function(errResponse) {
                            alert(" Error while fetching User");
                        });        
   }

【讨论】：