ssm整合-图片上传功能(转)

本文介绍 ssm (Spring+SpringMVC+Mybatis)实现上传功能。

以一个添加用户的案例介绍(主要是将上传文件)。

一、需求介绍

我们要实现添加用户的时候上传图片(其实任何文件都可以)。

文件名:以 博客名+日期的年月日时分秒毫秒形式命名

如 言曌博客2017082516403213.png

路径:上传到 uploads 文件夹,并 生成相应的 年和月 子文件夹

如 uploads/2017/8/言曌博客2017082516403213.png

数据库:将"年/月/"+文件名 存储到数据表中

如 2017/8/言曌博客20170825164809907.jpg

二、导入 Jar 包

上传功能需要额外的两个 jar 包,如下

导入 环境中

我这里使用是 Maven,添加依赖

 1 <!--文件上传-->
 2 <dependency>
 3   <groupId>commons-fileupload</groupId>
 4   <artifactId>commons-fileupload</artifactId>
 5   <version>1.2.2</version>
 6 </dependency>
 7 <dependency>
 8   <groupId>commons-io</groupId>
 9   <artifactId>commons-io</artifactId>
10   <version>2.4</version>
11 </dependency>

三、代码结构

文件上传到如图 uploads,如果你和博主也是使用了 Maven,文件其实是上传到

ForestBlog\target\ForestBlog\resource\uploads\2017\8 里面,这个没影响的。

但是要要记得在 clean 之前把 \target\ForestBlog\resource\uploads 文件复制到

src\main\ForestBlog\resource\uploads 中

四、代码实现

我们这里主要看上传部分代码,其他的配置文件也贴一下吧

1、springmvc 配置 (springmvc.xml部分代码)

1 <!--文件上传-->
2 <bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
3     <!--设置上传最大尺寸为5MB-->
4     <property name="maxUploadSizePerFile" value="5242880"/>
5     <property name="defaultEncoding" value="UTF-8"/>
6     <property name="resolveLazily" value="true"/>
7 </bean>

2、jsp 页面 (createUser.jsp部分代码)

1 <form action="${pageContext.request.contextPath}/createUserSubmit.action"
2       method="post" enctype="multipart/form-data" >
3        <input type="file" name="upload_avatar">
4        <input type="submit" value="提交">
5 </form>

3、控制器代码(UserController.java 中 添加用户类)

//添加用户提交
    @RequestMapping(value = "/createUserSubmit",method = RequestMethod.POST)
    public String createUserSubmit(UserCustom userCustom,MultipartFile upload_avatar ) throws Exception {
        //上传图片
        if(upload_avatar.getSize()!=0) {
            String newFileName = functions.uploadFile(request,upload_avatar);
            userCustom.setAvatar(newFileName);
        }
        userCustom.setLastloginip(functions.getIpAddr(request));
        userService.createUser(userCustom);
        return "redirect:userList.action";
    }

4、上传文件代码 (functions.java 记得要注入)

 1 //上传文件
 2     public String  uploadFile(HttpServletRequest request,MultipartFile uploadFile) throws IOException {
 3         SimpleDateFormat sdf = new SimpleDateFormat("yyyyMMddHHmmssSS");
 4         String res = sdf.format(new Date());
 5         //uploads文件夹位置
 6         String rootPath =request.getServletContext().getRealPath("/resource/uploads/");
 7         //原始名称
 8         String originalFilename = uploadFile.getOriginalFilename();
 9         //新的文件名称
10         String newFileName = "言曌博客"+res+originalFilename.substring(originalFilename.lastIndexOf("."));
11         //创建年月文件夹
12         Calendar date = Calendar.getInstance();
13         File dateDirs = new File(date.get(Calendar.YEAR)
14             + File.separator + (date.get(Calendar.MONTH)+1));
15         //新文件
16         File newFile = new File(rootPath+File.separator+dateDirs+File.separator+newFileName);
17         //判断目标文件所在的目录是否存在
18         if(!newFile.getParentFile().exists()) {
19             //如果目标文件所在的目录不存在,则创建父目录
20             newFile.getParentFile().mkdirs();
21         }
22         System.out.println(newFile);
23         //将内存中的数据写入磁盘
24         uploadFile.transferTo(newFile);
25         //完整的url
26         String fileUrl =  date.get(Calendar.YEAR)+ "/"+(date.get(Calendar.MONTH)+1)+ "/"+ newFileName;
27         return fileUrl;
28     }

主要关注 上传文件的方法,属性注入这里就不赘述了

写的步骤很完整、清晰

https://liuyanzhao.com/5989.html

原文地址:https://www.cnblogs.com/thyHome/p/9097934.html

时间: 2024-11-13 14:47:55

ssm整合-图片上传功能(转)的相关文章

drupal中安装CKEditor文本编辑器,并配置图片上传功能 之 方法二

drupal中安装CKEditor文本编辑器,并配置图片上传功能 之 方法一 中介绍了ckeditor的安装和配置方法,其实还有另一种新方法,不用IMCE模块. 不过需要ckfinder的JS库,可以到http://ckfinder.com/download下载,下载后放到ites\all\modules\contrib\ckeditor文件夹下如图, 然后到admin/config/content/ckeditor/edit/Full配置一下 就行了

FLASH图片上传功能—从百度编辑器UEditor里面提取出来

为了记录工作中碰到的各种问题,以及学习资料整理,今天开始,将以往的文章进行了一个整理,以后也开始认真的记录学习过程中的各种问题 在HTML里面的文件上传功能一直是个问题,为了实现上传文件大小限制,怎样显示进度条问题,以及上传前图片预览,也试过各种办法,直到有一天看到百度编辑器中的图片上传功能.花了点功夫把他单独提取出来. 最终效果图如下: 这个功能可以提供多个图片文件选择,预览,然后对上传的图片在上传队列中删除,以及旋转和,上传中进度条显示,以及上传相册的选择. 源代码下载路径为: http:/

megapix-image插件 使用Canvas压缩图片上传 解决手机端图片上传功能的问题

最近在弄微信端的公众号.订阅号的相关功能,发现原本网页上用的uploadify图片上传功能到手机端有的手机类型上就不能用了,比如iphone,至于为啥我想应该不用多说了吧(uploadify使用flash实现上传的): 经过研究找到了一个手机端比较相对比较好用的插件实现图片上传,那就是megapix-image插件,比uploadify还是好用多了,下面就来上实例吧: html页面: <html> <body> <input type="file" cap

淘淘商城图片上传功能的实现

前提: 参考:集群环境下图片上传的功能分析.vmware的安装,linux的安装.nginx和ftp服务在linux的安装,ftp的客户端的使用. 图片上传是图片存储到ftp服务器上面,所以这里不需要操作mapper层. 这里用了几个工具类 ftp图片上传的工具类,图片名字的一种新的生成方式,json与java类的转换工具. 这里图片上传采用的是富文本编辑器的一个图片上传插件,在jsp页面实现的. http://kindeditor.net/docs/upload.html 根据这几个jsp页面

SSM实现图片上传返回预览图心得

Spring MVC 实现文件上传 时序图 利用 Spring MVC 实现文件上传功能,离不开对 MultipartResolver 的设置.MultipartResolver 这个类,你可以将其视为 Spring MVC 实现文件上传功能时的工具类,这个类也只会在文件上传中发挥作用.在配置了具体实现类之后,Spring MVC 中的 DispatcherServlet 在处理请求时会调用 MultipartResolver 中的方法判断此请求是不是文件上传请求.如果是,DispatcherS

android之使用GridView+仿微信图片上传功能(附源代码)

由于工作要求最近在使用GridView完成图片的批量上传功能,我的例子当中包含仿微信图片上传.拍照.本地选择.相片裁剪等功能,如果有需要的朋友可以看一下,希望我的实际经验能对您有所帮助. 直接上图,下面的图片就是点击"加号"后弹出的对话框,通过对话框可以根据自己需求进行相片选择. 项目结构: 下面直接上代码. 整体的布局文件activity_main.xml 1 <LinearLayout xmlns:android="http://schemas.android.co

Jquery图片上传功能整理

最近在做一个图片上传到服务器的功能,之前基本没有什么JS的经验,用的也是网上的插件.做了一个星期才把他弄好,现在做一下总结,方便以后查看. 用的插件是WebUploader,上面有很多例子,我找的例子如下图: 在实例化WebUploader的时候需要修改upload.js文件中的server的地址,这样才能将指定的图片上传到服务器代码如下: // 实例化 uploader = WebUploader.create({ pick: { id: '#filePicker', label: '点击选择

图片上传功能&lt;转&gt;http://blog.csdn.net/u011159417/article/details/50126023

以前也实现过上传,只不过每次都是,写完之后没有总结,下次遇到时,还要重新写,重新调式,很是浪费时间,所以,今天实现一个上传图片的功能,包括简单的页面和servlet,下次再要写这个功能时,直接拿过来就可以了,没有理论,直接上代码+少量的注释.在最下面我会把项目上传,大家需要jar包,可以从项目中拿. 该项目用到的jar包如图,在下面的项目demo中有jar包: 一.upload.jsp页面代码: [html] view plain copy print? <%@ page language=&quo

easyui 图片上传功能详解

页面展示: 1.点击图片上传 跳转页面 携带2个参数  ID  NAME=所属模块 jsp 如图: js  可以上传文件和图片代码: $(function() {var falg=0;    $list = $('#thelist');    var uploader = WebUploader.create({        // 选完文件后,是否自动上传.        auto : false,        // swf文件路径        swf : 'plugins/expand/