ssm上传文件获取路径_SSM实现图片上传下载功能

0. 基本步骤框架搭建

实现带图片上传的注册功能

实现下载功能

1. 框架搭建

Step1 创建开发项目

创建基础MVC包结构:controller、service、mapper、pojo

Step2 导入jar包

导入SpringMVC的jar、Spring的jar、MyBatis的jar、上传文件的jar

Step3 配置文件配置applicationcontext.xml文件

开启service包注解扫描

配置数据库信息properties文件

配置数据源bean

配置SqlSession工厂bean

配置mapper扫描bean,记得把工厂依赖设置为属性注入

配置事务管理

配置springmvc.xml文件

配置controller包注解扫描

配置springmvc 注解驱动

配置静态资源放行

配置文件上传资源解析bean

配置web.xml文件

配置spring配置文件加载路径

配置spring容器资源加载监听器

配置SpringMVC的DispatcherServlet

配置编码过滤器

2. 实现带图片上传的注册功能

基本思路:

Step1 先实现图片的异步上传,反显图片,获取图片上传后的存储路径,

Step2 将注册的数据、头像图片的存储路径一并提交至后台完成注册。

2.1 JS实现图片异步上传

实现思路:

Step1 首先引入jQuery文件

Step2 添加注册按钮单击事件

Step3 获取上传文件数据、利用FormData对象封装数据

Step4 ajax方式提交后台,注意processData设置为false、contentType设置为false

Step5 上传成功后回显图片,将图片路径填至隐藏域

具体JS实现图片上传方法:$(function(

$("#uploadBtn").click(function(){

// 获取上传文件

var uploadPhoto = $("#upload")[0].files[0];

// 利用FormDate对象封装文件数据

var formdata = new FormData();

formdata.append("uploadPhoto",uploadPhoto);

$.ajax({

url:'regUpload',

type:'post',

processData:false,

contentType:false,//设置false,将请求数据类型设置为multipart/form-data

data:formdata,

success:function(data){

if(data.result){

alert("上传成功!");

$("#imageSpan").html("<%=basePath%>%22+data.msg+%22");

$("#imgPath").val(data.msg);

}else{

alert("上传失败!原因:"+data.msg);

}

}

});

});

));

2.2 后台处理上传的图片

实现思路:

1、获取文件在服务器存储中的实际路径

2、获取文件原始文件名,随机生成文件名

3、实际路径拼接随机文件名,将文件存储至目标路径

4、存储文件的原始名、随机名、文件类型至数据库

5、返回上传结果、存储路径+文件名

具体代码如下:@RequestMapping("regUpload")

@ResponseBody

public Result regUpload(MultipartFile uploadPhoto, HttpServletRequest request) throws IOException {

// 业务处理

// 1、获取文件在服务器存储中的实际路径

String realPath = request.getServletContext().getRealPath("/uploadImage/");

File pathFile = new File(realPath);

if(!pathFile.exists()){

pathFile.mkdirs();

}

// 2、获取文件原始文件名,随机生成文件名

String originalFilename = uploadPhoto.getOriginalFilename();

String suffix = originalFilename.substring(originalFilename.lastIndexOf("."));

String fileName = UUID.randomUUID()+suffix;

// 3、实际路径拼接随机文件名,将文件存储至目标路径

uploadPhoto.transferTo(new File(realPath+fileName));

// 4、存储文件的原始名、随机名、文件类型至数据库

String contentType = uploadPhoto.getContentType();

PhotoImage photoImage = new PhotoImage("/uploadImage/"+fileName, originalFilename, fileName, contentType );

System.out.println("============================");

int flag = 0 ;

try{

flag =photoImageService.insertImage(photoImage);

}catch (Exception e){

e.printStackTrace();

}

if(flag==1){

// 5、返回上传结果、存储路径+文件名

Result result = new Result(true,"uploadImage/"+fileName);

return result;

}else{

return new Result(false,"图片存储失败!");

}

}

2.3 html页面实现

用户名:
密码:
上传文件:

2.4 实现用户信息注册功能

实现思路:

Step1 用

标签收集页面所有数据

Step2 submit按钮提交至后台

Step3 通过service、mapper存储

具体实现代码:@RequestMapping("regUser")

public String regUser(User user){

// 业务处理

int flag = userService.insertUser(user);

// 请求转发

//return "forward:register.jsp";

return "register";

}

3. 实现图片下载功能

实现思路:

Step1 前台用超链接触发下载功能,将要下载的文件名作为请求参数带上

Step2 后台接收请求,先设置响应头,表明为下载请求:`response.setHeader("Content-Disposition", "attachment;filename="+filenName);`

Step3 获取文件的在硬盘上的绝对路径

Step4 利用FileUtils将文件转成byte数组

Step5 从相应对象中获取输出流,将byte数组写出

Step6 清除输出流的缓存、关闭输出流

具体代码:@RequestMapping("downloadFile")

public void downloadFile(String filename,HttpServletRequest req, HttpServletResponse resp) throws IOException {

// Step2 后台接收请求,先设置响应头,表明为下载请求

resp.setHeader("Content-Disposition", "attachment;filename="+filename);

// Step3 获取文件的在硬盘上的绝对路径

String realPath = req.getServletContext().getRealPath("/uploadImage/");

// Step4 利用FileUtils将文件转成byte数组

File file = new File(realPath,filename);

byte[] bytes = FileUtils.readFileToByteArray(file);

// Step5 从相应对象中获取输出流,将byte数组写出

ServletOutputStream os = resp.getOutputStream();

os.write(bytes);

// Step6 清除输出流的缓存、关闭输出流

os.flush();

os.close();

}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值