上传excel表格批量插入到数据库

前因

最近在做的项目是在线考核平台(目前已经在测试阶段),里面涉及到的业务复杂度很深(公司项目,不便多说),业务逻辑和需求契合度也很高,在开发过程中就遇到了很多很多的问题。
我的计划是在开发结束后把自己遇到的问题全都传到网上,以一种笔记的形式进行共享与记录,希望共同成长、共同进步!

那么闲话少说

需求-导入excel表格,把表格中的数据存到数据库中

这是我开发中遇到的困难之一,由于之前没有遇到过这种excel表格批量上传的需求,所以第一次碰到蒙了一下,转而之后就是兴奋,对未知知识的索取与分析问题的喜悦(都有)
-----以上是我的废话

不比比,上思路、上代码

一.思路

1.上传文件
2.转换base64编码,获取信息
3.获取Sheets中第一个sheets的名字
4.获取关于此名字的数据
5.转换成json数据
6.ajax接受数据传入后台
7.进行数据的批量插入
二.代码

前台

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>js导入excel</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
</head>
<body>

<input type="file"onchange="importf(this)" />按钮

<script src="../../css/EXCELE/xlsx.full.min.js"></script>
<script src="../../css/EXCELE/jquery.js"></script>
<script src="../../css/EXCELE/xlsx.core.min.js"></script>
<script>

    var wb;//读取
    var rABS = false;

    //开始导入
    function importf(obj) {
        if(!obj.files) {
            return;
        }
        var f = obj.files[0];
        var reader = new FileReader();
        reader.onload = function(e) {
            var data = e.target.result;
            if(rABS) {
                wb = XLSX.read(btoa(fixdata(data)), {//手动转化
                    type: 'base64'
                });
            } else {
                wb = XLSX.read(data, {
                    type: 'binary'
                });
            }
            /**
             * wb.SheetNames[0]是获取Sheets中第一个Sheet的名字
             * wb.Sheets[Sheet名]获取第一个Sheet的数据
             */
            var excelJson = XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]);
            $.ajax({
                url: "/Login/oneinput",
                type: "POST",
                dataType: "json",
                contentType:"application/json",
                data: JSON.stringify( excelJson ),
                success: function (data) {
                    alert("上传成功,您上传的单选题中有"+data+"题是重复的!")
                    window.location.reload();//页面刷新
                }
            });
        };
        if(rABS) {
            reader.readAsArrayBuffer(f);
        } else {
            reader.readAsBinaryString(f);
        }
    }

    //文件流转BinaryString
    function fixdata(data) {
        var o = "",
            l = 0,
            w = 10240;
        for(; l < data.byteLength / w; ++l) o += String.fromCharCode.apply(null, new Uint8Array(data.slice(l * w, l * w +
            w)));
        o += String.fromCharCode.apply(null, new Uint8Array(data.slice(l * w)));
        return o;
    }
</script>
</body>
</html>

后台

//批量导入 单选
    @PostMapping("/oneinput")
    public int oneinput(@RequestBody List<DXPOJO>  xuanZePojos) {
        if(session.getAttribute("phone")==null){
            return 0;
        }
        return loginService.oneinput(xuanZePojos);
    }

3.注意

以上代码是实现批量上传excex的全部代码有几点需要注意
1.你需要建立一个实体类用来响应页面传来的信息,实体类中的属性名需要与excel表中的列名对应,不可以不同,否则会接到null值
2.接到的数据格式是List的格式,前台格式为json格式,在ajax请求头需要添加

  dataType: "json",
  contentType:"application/json",

否则报错
3.在上传的excel中不允许有多个表单
例:
在这里插入图片描述
不可以这样,数据会乱掉,一定注意
4.不可以有串行
5.不可以有不必要的备注
例:
上传excel表格批量插入到数据库_第1张图片
这样的在里面,怎么分类,怎么搞?你不炸谁炸!
6.只允许留下列名和数据,其他的合并单元格一类的名不可以存在
例:
在这里插入图片描述
第二行是对的,第一行必须删除

4.需要的包有
地址:这里

你可能感兴趣的:(项目经验,javascript,css,html5,java,spring)