SpringBoot+layui实现文件上传功能

SpringBoot+layui实现文件上传功能

什么是spring boot

Spring Boot是由Pivotal团队提供的全新框架，其设计目的是用来简化新Spring应用的初始搭建以及开发过程。该框架使用了特定的方式来进行配置，从而使开发人员不再需要定义样板化的配置。用我的话来理解，就是spring boot其实不是什么新的框架，它默认配置了很多框架的使用方式，就像maven整合了所有的jar包，spring boot整合了所有的框架（不知道这样比喻是否合适）。

页面代码(只需要引入基础layui的css与js)

多文件列表上传

选择多文件

开始上传

JS

layui.use('upload', function(){

var $ = layui.jquery

,upload = layui.upload;

//多文件列表示例

var demoListView = $('#demoList')

,uploadListIns = upload.render({

elem: '#testList'

,url: 'upload/uploadFile'

,accept: 'file'

,multiple: true

,auto: false

,size: 5120

,bindAction: '#testListAction'

,choose: function(obj){

var files = this.files = obj.pushFile(); //将每次选择的文件追加到文件队列

//读取本地文件

obj.preview(function(index, file, result){

var tr = $(['

,'

,'

,'

,'

,'重传'

,'删除'

,'

,'

//单个重传

tr.find('.demo-reload').on('click', function(){

obj.upload(index, file);

});

//删除

tr.find('.demo-delete').on('click', function(){

delete files[index]; //删除对应的文件

tr.remove();

uploadListIns.config.elOxZfYNKhbBem.next()[0].value = ''; //清空 input file 值，以免删除后出现同名文件不可选

});

demoListView.append(tr);

});

}

,done: function(rOxZfYNKhbBes, index, upload){

if(res.code == 0){ //上传成功

var tr = demoListView.find('tr#upload-'+ index)

,tds = tr.children();

tds.eq(2).html('上传成功');

tds.eq(3).html(''); //清空操作

return delete this.files[index]; //删除文件队列已经上传成功的文件

}

this.error(index, upload);

}

,error: function(index, upload){

var tr = demoListView.find('tr#upload-'+ index)

,tds = tr.children();

tds.eq(2).html('上传失败');

tds.eq(3).find('.demo-reload').removeClass('layui-hide'); //显示重传

}

});

});

后台接收

public final static String UPLOAD_FILE_PATH = "D:\\uploadFile\\";

@RequestMapping(value = "uploadFile")

public String uploadImage(@RequestParam("file") MultipartFile file) {

if (!file.isEmpty()) {

Map resObj = new HashMap<>(MAP_SIZE);

try {

BufferedOutputStream out = new BufferedOutputStream(

new FileOutputStream(new File(UPLOAD_FILE_PATH, file.getOriginalFilename())));

out.write(file.getBytes());

out.flush();

out.close();

} catch (IOException e) {

resObj.put("msg", "error");

resObj.put("code", "1");

return JSONObject.toJSONString(resObj);

}

resObj.put("msg", "ok");

resObj.put("code", "0");

return JSONObject.toJSONString(resObj);

} else {

return null;

}

OxZfYNKhbB }

总结

以上所述是给大家介绍的SpringBoot+layui实现文件上传功能，希望对大家有所帮助，如果大家有任何疑问请给我留言，会及时回复大家的。在此也非常感谢大家对我们网站的支持！

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。