SSM实现图片上传功能

效果

在前端页面点击上传图片功能按钮，即弹出文件管理器，选择图片并上传；

思路

在前端页面添加 input 标签，type选择file。在后端controller编写方法。方法体： 定义一个文件保存的相对路径，本地运行的项目就定义本地路径，服务器项目就定义服务器路径。定义文件名。生成uuid作为文件名称、获得文件类型、文件名后缀、最后得到文件名、生成文件保存路径。把图片的相对路径写入数据库中。

前端代码

<form class="layui-form " action="${pageContext.request.contextPath}/home/add" enctype="multipart/form-data" method="post" onsubmit="return sumbit_sure()" ><div class="layui-form-item"><label class="layui-form-label">图片</label><div class="layui-input-inline"><input type="file" name="file" ></div></div><div class="layui-form-item"><div class="layui-input-block"><button class="layui-btn" type="submit">立即提交</button></div></div></form>

注意 ！enctype="multipart/form-data" method="post" οnsubmit="return sumbit_sure()" 必须填写

后端代码

@RequestMapping("/add")public String add(Home home, Model model) throws IOException{String sqlPath = null;//定义文件保存的本地路径String localPath="E:\酒店后台管理系统\程序\upload";//定义 文件名String filename=null;if(!home.getFile().isEmpty()){//生成uuid作为文件名称String uuid = UUID.randomUUID().toString().replaceAll("-","");//获得文件类型(可以判断如果不是图片，禁止上传)String contentType=home.getFile().getContentType();//获得文件后缀名String suffixName=contentType.substring(contentType.indexOf("/")+1);//得到 文件名filename=uuid+"."+suffixName;System.out.println(filename);//文件保存路径home.getFile().transferTo(new File(localPath+filename));}//把图片的相对路径保存至数据库sqlPath = "/upload/"+filename;System.out.println(sqlPath);home.setImg(sqlPath);homeService.addHome(home);model.addAttribute("home",home);return "home_show";}