使用AngularJS的Java / Spring / MultipartFile文件上传：DefaultHandlerExceptionResolver：MultipartFile参数不存在“控制器正在获取文件

Question

  

Spring-controller正在获取MultipartFile，但它仍在抛出

“DefaultHandlerExceptionResolver：186 - 处理程序执行导致异常：必需的MultipartFile参数'txnFile'不存在” 这导致AngularJS客户端调用因400失败。

JAVA的弹簧控制器：

@RequestMapping(value = "/uploadMultipleFile", method = RequestMethod.POST)
public @ResponseBody Response uploadMultipleFileHandler(
        @RequestParam("fileType") String fileType,
        @RequestParam("fileEtx") String fileEtx,
        @RequestParam("country") String country,
        @RequestParam("network") String network,
        @RequestParam("version") String version,
        @RequestParam("txnDate") String txnDateStr,
        @RequestParam("txnFile") MultipartFile txnFile,
        @RequestParam("exceptionFile") MultipartFile exceptionFile){
    Response response= null;
    try {

  

这里，txnFile和exceptionFile不为null。代码也运行文件。但它仍然抛出“DefaultHandlerExceptionResolver：186 - 处理程序执行导致异常：所需的MultipartFile参数'txnFile'不存在”

Java的弹簧配置： <bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver"> <property name="maxUploadSize" value="1000000" /> </bean>

HTML-AngularJS表格

<form method="POST" action="http://localhost:8080/recon-validation-tool/ctrl/core/uploadMultipleFile" enctype="multipart/form-data">
    <fieldset>
        <legend>Select Txn file:</legend>
        <div class="form-group">
            <label for="">Txn-file:</label>
            <input type="file" file-model="txnFile"/>
        </div>
    </fieldset>

    <fieldset>
        <legend>Select Exec file:</legend>
        <div class="form-group">
            <label for="">Exec file:</label>
            <input type="file" file-model="exceptionFile"/>
        </div>
    </fieldset> 

    <fieldset>
        <legend>Please enter carrier details:</legend>

        <div class="form-group">
            <label for="txnDate">Date:</label>
            <input type="date" name="txnDate" ng-model="formData.txnDate" value="2017-05-30">
        </div>

        <div class="form-group">
            <label for="fileType">Type:</label>
            <input type="text" name="fileType" ng-model="formData.fileType">
        </div>

        <div class="form-group">
            <label for="fileEtx">Ext:</label>
            <input type="text" name="fileEtx" ng-model="formData.fileEtx">
        </div>

        <div class="form-group">
            <label for="country">country:</label>
            <input type="text" name="country" ng-model="formData.country">
        </div>

        <div class="form-group">
            <label for="country">network:</label>
            <input type="text" name="network" ng-model="formData.network">
        </div>

        <div class="form-group">
            <label for="version">version:</label>
            <input type="text" name="version" ng-model="formData.version">
        </div>
    </fieldset>
    <br>
    <button ng-click="uploadFile()">Validate</button>
</form>

AngularJS-控制器：

controllerM.controller('HomeController', function($scope, $http, $location, $rootScope){
$scope.formData= {};
$scope.formData.fileEtx= "";
$scope.formData.fileType= "";
$scope.formData.country= "";
$scope.formData.network= "";
$scope.formData.version= "";
$scope.formData.txnDate= "";

$scope.uploadFile = function(){
    var data = new FormData();
    data.append('fileEtx', $scope.formData.fileEtx);
    data.append('fileType', $scope.formData.fileType);
    data.append('country', $scope.formData.country);
    data.append('network', $scope.formData.network);
    data.append('version', $scope.formData.version);
    data.append('txnDate', $scope.formData.txnDate);
    data.append('txnFile', $scope.txnFile);
    data.append('exceptionFile', $scope.exceptionFile);

    var uploadUrl = "http://localhost:8080/recon-validation-tool/ctrl/core/uploadMultipleFile";

    $http.post(uploadUrl, data, {
        headers: {'Content-Type': undefined},
        transformRequest: angular.identity
    })
    .success(function(resp){
        console.log(resp);
    })
    .error(function(resp){
        console.log(resp);
    });
};

}）;