spingMVC非同步上傳檔案

標籤：original   iat   bottom   做了   div   mapr   request   string   檔案中   

架構是個強大的東西，一般你能想到的，架構都會幫你做了，然後只需要會用就行了，spingmvc中有處理非同步請求的機制，而且跟一般處理請求的方法差別不大，只是多了一個註解；spingmvc也可以將string、list、map轉化成json資料；然後前台發起一個ajax請求，幕後處理完成返回json資料，這就是非同步上傳檔案的基本思路。

1、springMVC處理非同步請求配置

　　首先是需要的jar包資源

　　上傳檔案的jar：

　　commons-fileupload-1.2.2.jar

　　commons-io-2.4.jar

　　json格式轉換的jar：

　　jackson-databind-2.5.4.jar

　　jackson-core-2.5.4.jar

　　jackson-annotations-2.5.0.jar

　　匯入Jackson的包之後，在控制器處理請求的方法中，就可以直接返回string、list、map，甚至可以是Map<String , List<String>>這樣格式的資料，架構都會轉換成json格式的資料返回給前台，因為springMVC內建就是使用Jackson來轉換格式的，所以只需要匯入jar包，架構就會幫我們自動轉換成json格式的資料。例如，在控制器的方法中返回了這樣的一個map  Map<String, List<String>> hashMap = new HashMap<String , List<String>>(); 返回到前台的格式就是：{"vals":["12136","896","128","10915"],"keys":["台區總數","一般警告","嚴重警告","正常台區"]}

　　匯入jar包資源之後還需要在springMVC的全域設定檔中設定檔上傳的bean，如果用到了json資料格式轉換也需要在全域設定檔中配置。

　　上傳檔案需要的配置：

<!-- 檔案上傳   設定檔案大小限制 -->    <bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">        <property name="maxUploadSize">            <value>5242880</value>        </property>        <!-- 設定預設的編碼方式 -->         <property name="defaultEncoding">              <value>UTF-8</value>          </property>     </bean>

 

　　

　　json格式轉換的配置：

<!-- 處理ajax請求，將返回的資料轉為json -->      <bean id="contentNegotiationManager" class="org.springframework.web.accept.ContentNegotiationManagerFactoryBean">        <property name="favorPathExtension" value="false" />      </bean>    <bean id="jsonConverter" class="org.springframework.http.converter.json.MappingJackson2HttpMessageConverter"></bean>      <bean id="stringConverter"          class="org.springframework.http.converter.StringHttpMessageConverter">          <property name="supportedMediaTypes">              <list>                  <value>text/plain;charset=UTF-8</value>              </list>          </property>      </bean>      <bean class="org.springframework.web.servlet.mvc.annotation.AnnotationMethodHandlerAdapter">          <property name="messageConverters">              <list>                  <ref bean="stringConverter" />                  <ref bean="jsonConverter" />              </list>          </property>      </bean> 

 

2、前台的ajax請求

　　前台使用ajax發起非同步請求，思路：非同步請求肯定是js來提交請求，但是這裡的輸入的內容是一個檔案，可以使用H5中的Formdata對象，然後通過js擷取到input中的值放到Formdata中，然後把Formdata傳到後台。

　　具體代碼如下：

$("#importDetialDataExcel").click(function(){        var detailDataExcel = document.detailDataForm.detailDataExcel.files[0];        var myForm = new FormData();        myForm.append("detailDataExcel",detailDataExcel);        $("#detailDataState").text("上傳中...");        ajaxImport(myForm,"uploadDetailData.shtml","#detailDataState");    });        // 用於發起非同步請求    function ajaxImport(myForm,myurl,state) {        $.ajax({            url : myurl,            type : "post",            data : myForm,            dataType : ‘json‘,            contentType : false, // 禁止佈建要求類型            processData : false, // 禁止jquery對DAta資料的處理,預設會處理            // 禁止的原因是,FormData已經幫我們做了處理            success : function(result) {                // alert(result.result);                showMsg(‘檔案‘ + result.result + ‘上傳成功‘, ‘bottom‘);                $(state).text("已上傳");            },            error : function(data) {                showMsg(‘檔案上傳失敗‘, ‘bottom‘);                $(state).text("上傳失敗");            }        });    }

 

　　

3、spingmvc控制器中的方法

　　資料到了幕後處理方式和平時差別不大，只需要在方法前加一個@ResponseBody註解，這樣返回的資料格式就是json格式，值得注意的是在方法的參數中，對象的類型就是MultipartFile，名稱必須和ajax請求參數中的名稱一致，detailDataExcel，也就是放入到Formdata中的參數名。接收到檔案後寫入到本地磁碟或者作其他處理。

　　具體代碼如下：

@RequestMapping("uploadDetailData.shtml")    @ResponseBody    public  Map<String, String> importDetailDataExcel(MultipartFile detailDataExcel)            throws RuntimeException, IOException {        Map<String, String> mapResult = new HashMap<String, String>(); // 建立map向用戶端返回資料        if (!detailDataExcel.isEmpty()) {            // 設定檔案上傳儲存的路徑            String path = "D:\\java\\workSpace\\ElectricSystem\\upload\\detailData\\";            String originFileName = detailDataExcel.getOriginalFilename(); // 擷取檔案的原始檔案名            File file = new File(path + originFileName);            detailDataExcel.transferTo(file); // 將檔案寫入磁碟            mapResult.put("result", originFileName);        }        return mapResult;    }

 

　　

spingMVC非同步上傳檔案