java web Excel导入、导出的实现

在做web开发时，我们经常会用到数据表格的导入导出功能，这样可以帮我们节省人工操作的时间，极大提高办事效率，下面，直入正题：
笔者所做的导入导出是针对java springMVC框架、工作簿poi以及前端plupload.js插件设计的。

第一步、总体介绍

首先，来看页面展示，如下图：

导入菜单包含模板下载和导入数据，如下图：

点击模板下载，弹出模板下载对话框，如下图：

点击导入数据，弹出导入对话框，如下图：

接下来，再来看看导出，包含导出当前页和导出全部，如下图：

点击导出当前页或是导出全部后，生成excel，如下图：

最后再来看看导入模板和生成的excel，如下图：

我的模板是放在src/main/webapp/template下的。

第二步、模板下载和导入

首先，来看看前台导入、导出的jsp代码：

<!-- 导出，当前页和页大小隐藏域 -->
<input type="hidden" name="currentPage" id="current" value="0"/>
<input type="hidden" name="pageSize" id="size" value="0"/>
ID：<input type="text" name="id" id="userId"/> 姓名：<input type="text" name="userName"/> <a href="javascript:void(0);" id="search">搜索</a>
</form>
</div>

<!-- 导入 -->
<a 
type="import" 
id="import" 
class="easyui-menubutton" 
suffix="xls"
resouseCode="user" 
importurl="sys/user/importData.do"
callback="myCallback">导入</a>
<!-- 导出 -->
<a type="export" id="export" class="easyui-menubutton">导出</a>

然后，再来看看js：

$(function() {
  var uploadsubmenu = '<div id="upload_sub" style="width:100px;">'+
  '<div id="download_templ"><span class="exportDownload"></span>模板下载</div>'+
  '<h1 class="excel-line" id="line1"></h1>'+
  '<div id="import_data"><span class="exportData"></span>导入数据</div>'+
  '</div>';
  if($("#upload_sub").length<1){
    $("body").append(uploadsubmenu);
  }

  //将导入设为菜单按钮
  var importMenu = $('#import').menubutton({ 
    menu: "#upload_sub",
    iconCls:"icon-import"
  }); 

  //为子菜单添加点击事件
  $(importMenu.menubutton('options').menu).menu({
    onClick: function (item) {
      if(item.id == 'download_templ'){
        var resouseCode = $('#import').attr('resouseCode');
        var suffix = $('#import').attr('suffix');
        loadTemplate(resouseCode, suffix);
      }
      if(item.id == 'import_data'){
        var importurl = $('#import').attr('importurl');
        var callback = $('#import').attr('callback');
        var resouseCode = $('#import').attr('resouseCode');
        makerUpload(importurl, callback, resouseCode);
      }
    }
});
});

/**
 * 模板下载
 */
function loadTemplate(resouseCode, suffix) {
  //文件名+后缀名
  var fileName = resouseCode + '.' + suffix

  var templatediv = '<div id="templatediv" style="width:400px;height:200px;">'+
  '</div>';
  if (window.top.$('#templatediv').length == 0) {
    window.top.$("body").append(templatediv);
  }
  var templistspan = "";
  templistspan +='<div class="download-list">'
  templistspan += '<span><a id="downloadBtn" href="file/fileHandle/downloadtemplate.do?fileName='+encodeURI(encodeURI( fileName))+'">'+fileName+'</a></span>'
  templistspan +='</div>';
  window.top.$("#templatediv").html(templistspan);
  //弹出下载模板
  window.top.$("#templatediv").dialog({
    title:"下载模板",
    modal:true  
  });

  //下载模板完了就关闭对话框
  window.top.$("#downloadBtn").click(function() {
    window.top.$("#templatediv").dialog('close');
  });
}

/**
 * 上传导入
 */
function makerUpload(importurl, callback, resouseCode) {
  console.log('弹出导入对话框。。');

  //用户详情对话框
  var importWindow = window.top.$('#importWin');
  if(importWindow.length <= 0) {
    importWindow = window.top.$("<div id='importWin'/>").appendTo(window.top.document.body);
  }
  importWindow.window({
    title:'导入',
    closed: false,
    closable: true,
    draggable: true,
    resizable: true,
    width: 500,
    height: 350,
    modal: true,
    href: 'sys/redirect/redirectHomePage.do?path=import&callback=' + callback + '&resouseCode=' + resouseCode + '&importurl=' + importurl,
    onClose: function() {
      importWindow.window("destroy");
    }
  });
}

然后，再来看看导出对话框对应的jsp页面import.jsp：

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
  String callback = request.getParameter("callback");
  String importurl = request.getParameter("importurl");
  String resouseCode = request.getParameter("resouseCode");
  System.out.println("callback:" + callback);
  System.out.println("importurl:" + importurl);
  System.out.println("resouseCode:" + resouseCode);
%>
<link rel="stylesheet" href="js/plugs/plupload/queue/css/jquery.plupload.queue.css" type="text/css"></link>
<script type="text/javascript" src="js/plugs/plupload/plupload.js"></script>
<script type="text/javascript" src="js/plugs/plupload/plupload.html4.js"></script>
<script type="text/javascript" src="js/plugs/plupload/plupload.html5.js"></script>
<script type="text/javascript" src="js/plugs/plupload/plupload.flash.js"></script>
<script type="text/javascript" src="js/plugs/plupload/zh_CN.js"></script>
<script type="text/javascript" src="js/plugs/plupload/queue/jquery.plupload.queue.js"></script>
<script type="text/javascript">
var callback = '<%=callback%>';
var resouseCode = '<%=resouseCode%>';
var importurl = '<%=importurl%>';
console.log('callback:', callback);
console.log('resouseCode:', resouseCode);
console.log('importurl:', importurl);
</script>
<!-- <div style="width:100%;height:100%;position:relative;">
    <button id="startImport" style="position:relative;top:224px;left:50px;height:20px;">开始导入</button>
</div> -->

<form id="form">
<div id="uploader">
</div>
</form>

<script type="text/javascript" src="resources/logicJS/common/common.js"></script>
<script type="text/javascript" src="resources/logicJS/common/import.js"></script>

再来看看其对应的import.js:

/*$(function() {
  console.log('windows是否一致', window === window.top);
  $('#startImport').click(function() {
    console.log('开始导入');

    var iframe = $('#mainPanel > iframe' ,window.top.document)[0];
    var currentChildWindow = iframe.contentWindow || iframe.window;
    console.log('callback', callback);
    currentChildWindow[callback]('qiyongkang');
  });
});*/

$(function() {
  var files = [];
  var errors = [];
  var type = 'file';
  var chunk = true;
  var startbutton = null;
  var des = "<div class='upload-sm'>";
  des += "单个文件最大不超过1mb; &nbsp;&nbsp;";
  des += "批量上传文件个数不超过1个; &nbsp;&nbsp;";
  des += "上传文件格式为:xls";
  des += "</div>";

  $("#uploader").pluploadQueue($.extend({
    runtimes : 'flash,html4,html5',
    url : 'file/fileHandle/upload.do?resouseCode=' + resouseCode,
    max_file_size : '1mb',
    file_data_name:'file',
    filters : [],
    dragdrop : false,
    flash_swf_url : 'js/plugs/plupload/plupload.flash.swf',
    init:{
      Init:function(uploader){
        //开始上传按钮
        startbutton = $(".plupload_start");
        $(".plupload_header").html(des);
      },
      QueueChanged:function(uploader){
        if(uploader.files.length > 1){
          var error = "<div class='upload-sm'>";
          error += "<font color=red>最多只能上传1个</font>";
          error += "</div>";
          $(".plupload_header").html(error);
          startbutton.hide();
        }else{
          $(".plupload_header").html(des);
          startbutton.show();
        }
      },
      FileUploaded:function(uploader,file,response){
        if(response.response){
          var rs = $.parseJSON(response.response);
          console.log(rs);
          if(rs.status){
            files.push(file.name);
          }else{
            errors.push(file.name);
          }
        }
      },
      UploadProgress:function(uploader,fs){
        var begin = "<div class='upload-sm'>";
        begin +="开始上传文件<img src='js/plugs/plupload/queue/img/uploading.gif'>";
        begin +="</div>";
        $(".plupload_header").html(begin);
      },
      //上传完毕后触发
      UploadComplete:function(uploader,fs){
        var e= errors.length ? ",失败"+errors.length+"个("+errors.join("、")+")。" : "。";
        var begin = "<div class='upload-sm'>";
        var value=parseInt(fs.length)-parseInt(errors.length);
        begin +="上传完成！共"+fs.length+"个。成功"+value+"个";
        begin +="</div>";
        $(".plupload_header").html(begin);
          importdata(importurl,callback);
      }
    }
  },(chunk ? {chunk_size:'1mb'} : {})));

});

/**
 * 导入数据
 * @param importurl
 * @param callback
 */
function importdata(importurl,callback){
  var des = "<div class='upload-sm'>";
  des +="正在解析入库<img src='js/plugs/plupload/queue/img/uploading.gif'>";
  des +="</div>";
  $(".plupload_header").html(des);

  $.ajax({
    url:importurl,
    type:"POST",
    dataType: "json",
    success: function (data) {
      var msg = "<div class='upload-sm'>";
      msg +=data.msg;
      msg +="</div>";
      $(".plupload_header").html(msg);

      //回调，重新加载数据
      var iframe = $('#mainPanel > iframe' ,window.top.document)[0];
      var currentChildWindow = iframe.contentWindow || iframe.window;
      console.log('callback', callback);
      currentChildWindow[callback]('qiyongkang');
    }
  });
}

其中的chunk的含义，笔者稍作解释，如果文件的大小超过chunk_size，那么此文件将分多次请求上传，待会儿就可以看到后台处理上传的请求逻辑。

第三步、导出当前页和导出全部

对应的jsp代码已在第二步给出，再来看导出对应的js:

/**
 * 初始化导出按钮
 */
function initMyExportMenu(){
  var exportsubmenu = '<div id="exportMenu_sub">'+
  '<div id="export_crrent"><span class="exportcurrent"></span>导出当前页</div>'+
  '<h1 class="excel-line"></h1>'+
  '<div id="export_all"><span class="exportall"></span>导出全部</div>'+
  '</div>';
  $("body").append(exportsubmenu);
  var exports = $("a[type='export']");
  $.each(exports,function(data){

    var exportMenu = $(this).menubutton({ 
      menu: "#exportMenu_sub",
      iconCls:"icon-export"

    }); 
    $(exportMenu.menubutton('options').menu).menu({
      onHide:function(){
      },
      onClick: function (item) {
      if(item.id=="export_crrent"){
        console.log('导出当前页');
        var options = $('#userListTab').datagrid('getPager').data("pagination").options;
        var curr = options.pageNumber;
        console.log('当前页：', curr);
        var pageSize = options.pageSize;
        console.log('页大小', pageSize);

        //通过隐藏域传参数
        $('#current').val(curr);
        $('#size').val(pageSize);

        $("#queryForm").form('submit',{
              url : 'sys/user/exportData.do',
              onSubmit : function() {
                return $(this).form('validate');
              },
              success : function(data) {
              }
         });

      }
      if(item.id=="export_all"){
        //通过隐藏域传参数
        $('#current').val(0);
        $('#size').val(0);

        console.log('导出全部');
        $("#queryForm").form('submit',{
          url : 'sys/user/exportData.do',
          onSubmit : function() {
            return $(this).form('validate');
          },
          success : function(data) {
            console.log('data', data);
          }
         });

      }

      }
    });

  });
}

/**
 * 回调函数
 * @returns
 */
function myCallback(name) {
  console.log('回调函数执行。。' + name);
  //重新加载datagrid
  $("#userListTab").datagrid('reload'); 
}

上面的回调函数是用于导入成功后重新加载datagrid。

第四步、导入导出的后台处理逻辑

首先，来看看UserController.java对应的代码：

/**
     * 
     * importTeleFraudEvent:导入数据. <br/>
     *
     * @author qiyongkang
     * @param request
     * @return
     * @since JDK 1.6
     */
    @RequestMapping
    @ResponseBody
    public ExtJsObject importData(HttpServletRequest request) {
        ExtJsObject result = new ExtJsObject(false, "导入不成功", null);
        try {
            String path = request.getSession().getAttribute("justpath").toString();
            File f = new File(path);
            FileInputStream fis = new FileInputStream(f);
            HSSFWorkbook book = new HSSFWorkbook(fis);
            result = userService.importData(book);
        } catch (Exception e) {
            e.printStackTrace();
            return renderObject(false, "导入不成功", null);
        }
        return result;
    }

    @RequestMapping
    @ResponseBody
    public ExtJsObject exportData(User user, HttpServletRequest request,
            HttpServletResponse response) {
        List<User> userList = null;
        try {
            if (user.getCurrentPage() != null && !user.getCurrentPage().equals(0)) {
                // 导出当前页
                userList = userService.getPageList(user);
            } else {
                // 导出所有
                userList = userService.listAll(user);
            }

            if (userList != null && userList.size() > 0) {
                // 开始导出，获取模板路径
                String templatePath = request.getSession().getServletContext().getRealPath("template/user.xls");

                // 写入工作簿
                userService.exportData(userList, templatePath, response);
            }
        } catch (Exception e) {
            log.error("导出失败", e);
            return new ExtJsObject(false, "导出失败", null);
        }
        return new ExtJsObject(true, "导出成功", null);
    }

以及对应的service实现：

@Override
    public ExtJsObject importData(HSSFWorkbook workBook) {
        HSSFSheet sheet = workBook.getSheetAt(0);
        int startReadRow = 2;
        int lastRowNum = sheet.getLastRowNum();
        for(int i = startReadRow; i <= lastRowNum; i++) {
            try {
                User entity = new User();

                HSSFRow row = sheet.getRow(i);

                //用户编号
                long id = Long.valueOf(ExcelUtil.getCellValue(row.getCell(0)));
                entity.setId(id);

                //用户姓名
                String userName = ExcelUtil.getCellValue(row.getCell(1));
                entity.setUserName(userName);

                //年龄
                int age = Integer.valueOf(ExcelUtil.getCellValue(row.getCell(2)));
                entity.setAge(age);

                userMapper.addUser(entity);
            } catch (Exception e) {
                e.printStackTrace();
                return new ExtJsObject(true, "导入失败", null);
            }
        }
        return new ExtJsObject(true, "导入成功", null);
    }

    @Override
    public List<User> getPageList(User user) {
        return userMapper.listUser(user);
    }

    @Override
    public void exportData(List<User> userList, String templatePath, HttpServletResponse response) throws Exception {
        //获取文件输入流，创建工作簿
        FileInputStream fis = new FileInputStream(new File(templatePath));
        HSSFWorkbook workBook = new HSSFWorkbook(fis);

        //设置导出文件名，并编码
        String fileName = "用户信息导出_" + System.currentTimeMillis()+".xls";
        fileName = URLEncoder.encode(fileName, "UTF-8");  
        response.setHeader("Content-Disposition", "attachment; filename=\"" + fileName + "\"");
        response.setContentType("application/octet-stream;charset=UTF-8"); 

        //创建输出流
        OutputStream outputStream = new BufferedOutputStream(response.getOutputStream());

        exportUserData(workBook, userList);

        //删除模板页
        workBook.removeSheetAt(0);

        //将工作簿写入输出流
        workBook.write(outputStream);

        //关闭资源流
        fis.close();
        outputStream.flush();  
        outputStream.close();
    }

    /**
     * 
     * exportUserData:将数据写入工作簿. <br/>
     *
     * @author qiyongkang
     * @param workBook
     * @param userList
     * @since JDK 1.6
     */
    private void exportUserData(HSSFWorkbook workBook, List<User> userList) {
        //克隆模板sheet
        HSSFSheet singleSheet = workBook.cloneSheet(0);

        //设置克隆的sheet名称
        workBook.setSheetName(1, "用户信息表");

        //获取cellStyle
        HSSFCellStyle style = ExcelUtil.getStyle(workBook); 

        //定义起始行，从第二行开始
        int singleRowIndex = 2;

        //开始遍历
        for (User user : userList) {
            try {
                //起始列索引
                int singleColIndex=0;

                //创建行
                HSSFRow singleRow = singleSheet.createRow(singleRowIndex++);

                //创建列
                HSSFCell singleCell = null;

                //用户编号,0
                singleCell=singleRow.createCell(singleColIndex++);
                singleCell.setCellValue(user.getId());
                singleCell.setCellStyle(style);

                //用户姓名,1
                singleCell=singleRow.createCell(singleColIndex++);
                singleCell.setCellValue(user.getUserName());
                singleCell.setCellStyle(style);

                //用户年龄,2
                singleCell=singleRow.createCell(singleColIndex++);
                singleCell.setCellValue(user.getAge());
                singleCell.setCellStyle(style);
            } catch (Exception e) {
                e.printStackTrace();
                continue;
            }
        }
    }

    @Override
    public List<User> listAll(User user) {
        return userMapper.listAll(user);
    }

再来看看模板下载以及文件上传的处理类FileHandleCtrl.java:

/**
 * Project Name:qyk_testSpringMVC
 * File Name:FileHandleCtrl.java
 * Package Name:com.qiyongkang.file.ctrl
 * Date:2015年11月1日下午3:01:05
 * Copyright (c) 2015, CANNIKIN(http://http://code.taobao.org/p/cannikin/src/) All Rights Reserved.
 *
*/

package com.qiyongkang.file.ctrl;

import java.io.BufferedInputStream;
import java.io.BufferedOutputStream;
import java.io.File;
import java.io.FileInputStream;
import java.io.IOException;
import java.io.InputStream;
import java.net.URLDecoder;
import java.util.Iterator;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.apache.commons.fileupload.servlet.ServletFileUpload;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.multipart.MultipartFile;
import org.springframework.web.multipart.MultipartHttpServletRequest;

import com.qiyongkang.file.util.FileUtil;
import com.qiyongkang.sys.controller.BaseController;

/**
 * ClassName:FileHandleCtrl <br/>
 * Function: TODO ADD FUNCTION. <br/>
 * Reason:   TODO ADD REASON. <br/>
 * Date:     2015年11月1日 下午3:01:05 <br/>
 * @author   qiyongkang
 * @version  
 * @since    JDK 1.6
 * @see      
 */
@Controller
@RequestMapping
public class FileHandleCtrl extends BaseController {

    /**
     * 
     * downloadtemplate:下载模板. <br/>
     *
     * @author qiyongkang
     * @param request
     * @param response
     * @throws IOException
     * @since JDK 1.6
     */
    @RequestMapping
    public void downloadtemplate(HttpServletRequest request, HttpServletResponse response) throws IOException {
        response.setContentType("text/html;charset=utf-8");
        request.setCharacterEncoding("UTF-8");
        BufferedInputStream bis = null;
        BufferedOutputStream bos = null;

        //获取template的目录路径
        String templatePath = request.getSession().getServletContext().getRealPath("template");
        System.out.println("templatePath:" + templatePath);

        String downLoadPath  = templatePath + File.separator + URLDecoder.decode(new String(request.getParameter("fileName")), "UTF-8");

        if("/".equals(File.separator)){
            downLoadPath = downLoadPath.replace("\\", "/");
        }
        try {
            File file = new File(downLoadPath);
            long fileLength = file.length();
            response.setContentType("application/x-msdownload;");
            response.setHeader("Content-disposition", "attachment; filename="+new String(file.getName().getBytes("UTF-8"), "ISO8859-1" ));
            response.setHeader("Content-Length", String.valueOf(fileLength));
            bis = new BufferedInputStream(new FileInputStream(downLoadPath));  
            bos = new BufferedOutputStream(response.getOutputStream());
            byte[] buff = new byte[2048];
            int bytesRead;
            while (-1 != (bytesRead = bis.read(buff, 0, buff.length))){
                bos.write(buff, 0, bytesRead);
            }
        } catch (Exception e){
            e.printStackTrace();
        } finally {
            if(bis != null){
              bis.close();
            }
            if(bos != null){
              bos.close();
            }
        }
    }

    /**
     * 
     * upload:文件上传. <br/>
     *
     * @author qiyongkang
     * @param request
     * @param response
     * @since JDK 1.6
     */
    @RequestMapping
    public void upload(HttpServletRequest request, HttpServletResponse response) {
        String justpath = "";
        String savePath = FileUtil.getResouseValue("uploadpath");
        String filename = null;
        // 当前正在处理的文件分块序号
        int chunk = Integer.valueOf(request.getParameter("chunk"));
        // 分块上传总数
        int chunks = Integer.valueOf(request.getParameter("chunks"));
        //文件名
        String resouseCode = request.getParameter("resouseCode");

        // 判断当前表单是否为"multipart/form-data"
        boolean isMultipart = ServletFileUpload.isMultipartContent(request);
        try {
            if (isMultipart) {
                MultipartHttpServletRequest multiReq = (MultipartHttpServletRequest) request;
                Iterator<?> i = multiReq.getFileNames();
                while (i.hasNext()) {
                    multiReq.getAttribute("chunk");
                    MultipartFile f = multiReq.getFile((String) i.next());
                    InputStream input = f.getInputStream();

                    // 文件名
                    filename = f.getOriginalFilename();
                    if (!FileUtil.savedFileNameCache.containsKey(filename)) {
                        FileUtil.savedFileNameCache.put(filename,
                                FileUtil.getSavedFileName(filename));
                    }
                    // 保存文件目录绝对路径
                    File dir = new File(savePath+"/"+resouseCode);
                    if (!dir.isDirectory() || !dir.exists()) {
                        dir.mkdirs();
                    }
                    // 保存文件绝对路径
                    justpath = dir + "/"+ FileUtil.savedFileNameCache.get(filename);
                    if (chunk == 0) {
                        File file = new File(justpath);
                        if (file.exists()) {
                            file.delete();
                        }
                        // 上传文件
                        FileUtil.uploadFile(input, justpath);
                    }
                    if (chunk > 0) {
                        // 追加文件
                        FileUtil.uploadFile(input, justpath, true);
                    }
                    if (chunk + 1 == chunks || chunks == 0) {
                        FileUtil.savedFileNameCache.remove(filename);
                        break;
                    }
                }


            }
        } catch (Exception e) {
            e.printStackTrace();
        }
        request.getSession().setAttribute("justpath", justpath);
    }
}

第五步、总结

其实，导入导出的核心逻辑就是首先上传文件，然后再对文件进行读写，而与excel操作相关的类就是工作簿类了。
以上的导入导出，笔者讲得很概括，只是贴出了代码，具体的含义还得大家去领悟，由于不同的框架所使用的导入导出有可能不一致，不过大体的思路应该是一致的，有兴趣的小伙伴可以自己去尝试下，挺有意思的！