EasyUI 单个/多个文件上传 SSM+EasyUI

关于文件上传和下载网上有很多相关教程，但针对入门的新人来说大部分都不够详细，而且由于一直换工作的原因（主要是因为自己的懒惰）把这篇整理拖延了很久，终于在今天打算将它完成了……（此处应有鸡蛋）

首先说要要完成的事情：

基于EasyUi+SSM框架完成文件上传，主要实用了easyui-filebox上传按钮；

准备工具：
环境：
　　Eclipse 4.3
　　jdk1.7.0_72
　　apache-maven-3.0.4
　　apache-tomcat-7.0.53
　　spring-mvc-4.0
　　spring-beans-4.0
　　mybatis-3.2.8
　　oracle 11.2.0.3.0

jar包：
　　commons-io-2.4
　　commons-fileupload-1.3

基本步骤：

　　按照数据流向来阐述：

　　　　>>> 页面提供文件上传控件；
　　　　>>> contorller端接收页面传入的文件流，在这个步骤可以写入数据库或者放到指定目录；
　　　　>>> 将上传的返回结果写回页面；

代码部分：

#jsp.js.jquery

 1 function uplodad(
 2     $(‘#fromNameId‘).form({
 3                 url:‘controllerurl‘,
 4                 onSubmit: function(){
 5                     //uploda before something
 6                 },
 7                 success:function(data){
 8                     //upload after something
 9                 },error:function(date){
10                     $.messager.alert(data.errormsg);
11                 }
12             });
13             $(‘#fromNameId‘).submit();
14 );

#jsp.html

1 <form id="rundApplyFrom" method="post" enctype="multipart/form-data">
2     <tr id="trIdCard">
3         <td>msg:</td>
4         <td><input class="easyui-filebox" id="uploadId" name="sourceFile" style="width:200px"></td>
5     </tr>
6 </from>
7
8 <!-- 这里的name属性需要和controller方法中用于接收上传文件Bean中的byte[]字段名字相同 -->

这里使用了EasyUi自带的filbox控件，在网上找了很多文件上传的资料都说要实用第三方插件什么的，但对于还是新人的我来说看着都一个头俩个个大；

于是看了一下相关资料和文档发现了这个东西；

使用步骤很简单：

　　1.在html/jsp页面做如上配置，一个用于上传文件的选择框；

　　2.通过ajax方式，使用jquery的标签选择器将form区域的id作为提交标记发起ajax访问controller中的upload方法（js部分代码）；

在controller中的upload方法形参可以接收一个pojo，内部需要有一个MultipartFile属性命名和form域中对应的name相同，这个例子中我使用的是sourceFile（见上）；

通过文章最开始提到的jar包自带的功能和SpringMVC的配置，可以将这里页面用户选择的文件自动存入pojo中对应的字段中（即sourceFile）；

# springMVC.xml 配置

  <bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
        <property name="defaultEncoding" value="UTF-8"/>
  </bean> 

# pojo.java

public class AReFundApplyProcess implements Serializable {

       private String prosn  ;
       private String applyid;
       private byte[] annex  ;
       private Object content;
       private MultipartFile[] sourceFile;

// sourceFile geter, seter

在这个pojo中我用于接收文件的MultipartFile字段用的是一个数组，因为在案例中是多文件上传；

在页面上file-box中的文件会通过springMVC存入这个pojo的MultipartFile字段中，对于多文件来讲通过获取角标即可获取到对应的文件；

#serviceImpl.java

　　/**
     * uplodaApplyFile
     * 方法描述：文件上传方法；
     * @param request
     */
    public void uplodaApplyFile(
            AReFundApplyProcess arProcess,
            AReFundApply aRefundApply){

        MultipartFile[] uploadfile=arProcess.getSourceFile();//这里用于获取前台传入Bean中Byte字段中的流；
        InputStream fileIs= null;                            //因为案例中是多文件上传，所以是数组；
        aRefundApply.setOrderno(arProcess.getProsn());

        try {
            if(uploadfile != null&& uploadfile.length>0){
                for (int i = 0; i < uploadfile.length; i++) {
                    MultipartFile file=uploadfile[i];
                    fileIs= file.getInputStream();
                    byte[] b = FileCopyUtils.copyToByteArray(fileIs);
                    if(b.length>0){
                        arProcess.setAnnex(b);
                        aReFundApplyCheckService.insertAReFundApplyProcess(arProcess);
                    }
                }
            }
        } catch (IOException e) {
            log.error("上传文件异常...",e);
        }
    }

这里可以看到，MultipartFile类可以有方法获取到一个Inputstrem，这样再将其转换为byte数组即可存入数据库中的BLOB字段了；

顺带一提关于BLOB字段存入Oracle数据库中的问题，经过验证，Mybatis支持直接将byte数组作为BLOB字段存入数据库；只需要在Mapper中指定jdbcType=BLOB即可；

参考资料：

http://blog.csdn.net/songanling/article/details/38951013