一、首先新建一个html页面,引入xlsx.core.min.js和jquery-3.4.0.js包。
1、添加点击上传excel文件如下:
<input type='file' id="upLoadExcel"/>
2、前端上传文件及封装自己需要的数据类型并传入后台的代码如下:
//上传解析excel表格并插入到数据库
$("#upLoadExcel").change(function (e) {
var files = e.target.files;
var fileReader = new FileReader();
fileReader.onload = function(ev) {
try {
var data = ev.target.result,
workbook = XLSX.read(data, {
type: 'binary'
}), // 以二进制流方式读取得到整份excel表格对象
persons = []; // 存储获取到的数据
} catch (e) {
console.log('文件类型不正确');
return;
}
// 表格的表格范围,可用于判断表头是否数量是否正确
var fromTo = '';
// 遍历每张表读取
for (var sheet in workbook.Sheets) {
if (workbook.Sheets.hasOwnProperty(sheet)) {
fromTo = workbook.Sheets[sheet]['!ref'];
console.log(fromTo);
persons = persons.concat(XLSX.utils.sheet_to_json(workbook.Sheets[sheet]));
// break; // 如果只取第一张表,就取消注释这行
}
}
for (var i = 0; i < persons.length; i++) {
//遍历并处理数据,封装成你需要的数据类型,,,,我这里封装存储成数组对象了,我处理的代码没有附加,
}
//发送请求到后台
$.post('${ctx}/folicacidreceives/upLondExcel',
{'persons':JSON.stringify(array)//array这是我封装好的数据并传入到后台。。注意array,没有我封装数据类型的代码,所以找不到array,这里你将你封装好的数据类型传入即可。
},function(flag){
alert(flag)
})
};
// 以二进制方式打开文件
fileReader.readAsBinaryString(files[0]);
});
二、java后台处理并插入到数据库
1、control层的代码如下:
@RequestMapping("/upLondExcel")
public void insertExcel(@RequestParam("persons") String persons){
upLondExcelService.insertExcel(persons);
}
2、service层代码如下:
public void insertExcel(String persons){
ObjectMapper objectMapper = new ObjectMapper();
JavaType javaType = objectMapper.getTypeFactory().constructParametricType(List.class, Person.class);
List<Person> list = null;
try {
list = objectMapper.readValue(persons.replace(""","\""), javaType);
for (Person person:list) {
person.setMajor_type("7");
person.setId(IdGen.uuid());
person.setDel_flag("0");
upLondExcelMapper.insertExcel(person);
}
} catch (IOException e) {
e.printStackTrace();
}
}
3、mapper层的接口以及mapper的xml文件就不一一放上了,还有别忘了加上实体类昂。
最后希望这个文章能对大家有所帮助!!