AngularJS + Spring + REST——发送多个文件和数据答案

【问题标题】：AngularJS + Spring + REST -- sending multiple files and dataAngularJS + Spring + REST——发送多个文件和数据
【发布时间】：2016-04-27 14:30:45
【问题描述】：

我有一个小问题...我无法将多个文件上传到我的服务器，请查看我的代码：

在 Spring 上下文中：

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

在弹簧控制器

    @RequestMapping(value = "/address-to-add-object/add", method = RequestMethod.POST)
    public void addObject(@RequestParam(value = "files", required = false) MultipartFile[] files, @RequestParam("formDataJson") String formDataJson) {
        //-- my stuff with formDataObject and uploaded files
    }

在角度控制器

         $scope.sendForm = function(){
            var formData = new FormData();
            formData.append('formDataJson', JSON.stringify($scope.myObject));
            var files = $("#file-0a").prop('files');
            var filesArray = [];
            for (var i = 0 ; i < files.length ; i ++){
                filesArray.push(files[i]);
            }
            formData.append('files', filesArray);
            ObjectService.add(formData).$promise.then(function () {
                Notification.info('success');
            }, function () {
                Notification.error('error');
            });
        };

在ObjectService

中

objectService.factory('ObjectService', ["$resource", function($resource) {
    var baseUrl = './address-to-add-object';
    return $resource(baseUrl, {},
        {
            add: {
                url: baseUrl + '/add',
                headers: {
                    'Content-Type': undefined
                },
                transformRequest: angular.identity,
                method: 'POST'
            }
        });
}]);

和请求内容：

------WebKitFormBoundaryNhBUQjEH2kAlVlog
Content-Disposition: form-data; name="formDataJson"

{---json object---}
------WebKitFormBoundaryNhBUQjEH2kAlVlog
Content-Disposition: form-data; name="files"

[object File],[object File],[object File]

------WebKitFormBoundaryNhBUQjEH2kAlVlog--

和来自控制台的错误

POST http://localhost:8080/project/address-to-add-object/add 500 (Internal Server Error)

现在描述我的问题；）

我可以轻松地发送一个文件和一些数据，但是当我想发送多个文件时，会出现上述错误或“文件”变量为空。我尝试使用 List ，包装到 bean，并且无法从 ajax 请求（或发送 filesArray 时的文件数组）拦截 fileList 对象（当发送 $("#file-0a").prop('files')）。

你能帮我解决这个问题吗，你有什么想法吗？

【问题讨论】：

标签： java jquery angularjs spring spring-mvc

【解决方案1】：

问题在于 sendig 文件 - 或未发送，因为如您所见，发送的是 toString 文件

[object File],[object File],[object File]

我不得不将文件添加到我的 FormData 对象：

var formData = new FormData();
formData.append('formDataJson', JSON.stringify($scope.touristObject));
var files = $("#file-0a").prop('files');
for (var i = 0 ; i < files.length ; i ++){
   formData.append('files', files[i]);
}

在 Spring Controller 端没有任何变化

【讨论】：