多檔案上傳這個問題以前困擾了我好久後來我經過我的不懈努力終於克服了，其實認真起來所有的事情都會變得特別簡單，直接上程式碼。

 架包 (maven) 現在還在手動架包的我只能大寫的服

   <dependency>
            <groupId>commons-fileupload</groupId>
            <artifactId>commons-fileupload</artifactId>
            <version>1.3.1</version>
        </dependency>
 

 前端程式碼

$scope.upload = function (data) {
        $scope.addData = data;
        var date = new FormData();  //儲存檔案格式流資料
        var logFile = $('#logFile')[0].files[0];
        if(logFile.size<20){
            return;
        }
        date.append('img', logFile);
        date.append('type',1);
        date.append('statu',0);
        $http({
            method : 'POST',
            url : "../graphic/fileLoad",
            data : date,  //僅僅存放的是檔案流資料
            headers : {
                'Content-Type' : undefined  //angularjs設定檔案上傳的content-type修改方式
            },
            transformRequest : angular.identity
        }).success(function(response) {
            $timeout(function () {
                $scope.showLoading=false;
            },300);
            if(response.data==1){
                $("#dialog-info").html('上傳成功');
                $scope.findPictureByType($scope.addData);
                $("#dialog-info").fadeIn();
                $timeout(function() {
                    $("#dialog-info").fadeOut();
                }, 2000);
            }else {
                $("#dialog-info").html('上傳失敗');
                $("#dialog-info").fadeIn();
                $timeout(function() {
                    $("#dialog-info").fadeOut();
                }, 2000);
                $scope.findPictureByType($scope.addData);
            };
        }).error(function (response) {
            $("#dialog-info").html('上傳失敗');
            $("#dialog-info").fadeIn();
            $timeout(function() {
                $("#dialog-info").fadeOut();
            }, 2000);
        });
    };
 

使用formData來進行進行流檔案的表單提交，通過ajax的提交方式來進行互動。

接下來controller,上傳檔案並返回圖片相對路徑，因為我們的圖片是上傳到伺服器tomcat做了虛擬路徑的對映，我的是對映到了我的D盤。所以只要提供相對路徑就可以找到圖片。type statu 兩個引數是我做資料庫記錄使用的，不用管

   String path = "";
        CommonsMultipartResolver coMultiResolver = new CommonsMultipartResolver(request.getSession().getServletContext());
        if (coMultiResolver.isMultipart(request)) {
            // 轉換Request
            MultipartHttpServletRequest multiRequest = (MultipartHttpServletRequest) request;
            //獲取圖片檔案
            List<MultipartFile> picFiles = multiRequest.getFiles("img");
            path = pictureService.fileUpLoad(picFiles,type,statu);
        }
        return gson.toJson(path);
 

Service,我的上傳檔案做了一個封包進行使用。

 String path = FileOperateUtil.PictureFileLoad(picFiles);
        logger.info("圖片上傳成功");

一層 用來進行迴圈圖片使用 工具類

  String requestUrl = PropertiesUtil.getPropertiesValue("sys", "Path");//得到請求的URL地址
        String path = "";
        //統一儲存到Library資料夾下
        String dataPath = FilePropertiesUtil.getLibraryFolder();
        //迴圈插入圖片
        for (MultipartFile file : picfile) {
            if (!file.isEmpty()) {
                path = FileOperateUtil.upload(file, requestUrl,dataPath);
            }
        }
        return path;

儲存地址這裡我用的是列舉類和配置檔案，你們可以直接使用字串絕對路徑就行，這樣就不用Tomcat的需路徑映射了。

檔案上傳工具類

  String filePath = "";//宣告檔案相對路徑，用來存取資料庫
        if(null != multipartFile) {
            //重新命名檔案
            String fileType = StringUtils.substringAfterLast(multipartFile.getOriginalFilename(), ".");//獲取檔案字尾名
            String newName = StrUtils.uuid() + ("".equals(fileType) ? "" : "." + fileType);//重新命名檔名稱
            //檔案上傳路徑
            String fullPath = dataPath+relativePath;//儲存檔案的資料夾全路徑
            //建立對應路徑資料夾
            java.io.File dir = new java.io.File(fullPath);
            if (!dir.exists()) {
                try {
                   dir.mkdirs();
                } catch (Exception e) {
                    e.printStackTrace();
                }
            }
            //上傳檔案
            String file = fullPath+"/"+newName;
            java.io.File localFile = new java.io.File(file);
            try {
                multipartFile.transferTo(localFile);
            } catch (IOException e) {
                e.printStackTrace();
            }
            filePath =relativePath+newName;
        }
        return filePath;

第一次對接angularjs  通過邏輯進行總結的  有問題可以評論