SpringMVC上传之方式第一种使用文件方式
【摘要】 ****文件上传 上传到哪里？服务器文件上传前提条件A form 表单的 enctype 取值必须是：multipart/form-data(默认值是:application/x-www-form-urlencoded)enctype:是表单请求正文的类型B method 属性取值必须是 PostC 提供一个文件选择域<input type=”file” />客户端发送请求到达前端控...
****文件上传
上传到哪里？服务器
- 文件上传前提条件
A form 表单的 enctype 取值必须是：multipart/form-data
(默认值是:application/x-www-form-urlencoded)
enctype:是表单请求正文的类型
B method 属性取值必须是 Post
C 提供一个文件选择域<input type=”file” />
客户端发送请求到达前端控制器，–》文件解析器—》返回给前端控制器–》Controller中文件上传的方法。
控制器操作：需要将表单中的数据存储到数据库，不能直接存图片，需要存储图片的路径。
配置文件解析器
<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
<property name="maxUploadSize" value="10485760"></property>
</bean>`
4. 上传方式（本地服务器）
图片的回显
<img src="" id="foo" width="200px" height= "300px"/>
<!--multiple 规定允许用户输入到input 元素的多个值-->
<input type="file" name="" id="bar" accept="image/*" multiple="multiple"/>
<script type="text/javascript">
bar.onchange = function(){
//1.创建一个文件读取对象
var r = new FileReader();
//2.读取input文件框中选中的文件
r.readAsDataURL(bar.files[0]);
//3.将读取的结果赋值给img标签的src属性
r.onload = function(){
foo.src = r.result;
}
}
</script>`
前端页面的代码参考如下所示：
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>上传图片</title>
</head>
<body>
<form action="fileupload1" method="post" enctype="multipart/form-data">
文件<input type="file" name="file"><br>
<button type="submit">上传</button>
</form>
</body>
</html>
后端控制器代码参考如下所示：
package com.aaa.controller;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.multipart.MultipartFile;
import org.springframework.web.servlet.ModelAndView;
import javax.servlet.http.HttpServletRequest;
import java.io.File;
import java.io.IOException;
import java.util.UUID;
@Controller
public class UploadController {
@RequestMapping("fileupload1")
public ModelAndView upload(MultipartFile file, HttpServletRequest request){
String path=request.getSession().getServletContext().getRealPath("/uploads");
System.out.println("路径："+path);
//通过上传到页面的地址来上传信息;
File f=new File(path);
if(!f.exists())
f.mkdir();
String filename=file.getOriginalFilename();
System.out.println(filename);
//2.UUID，设置文件名;
filename+= UUID.randomUUID().toString()+filename;
//发现aaa.jpg出来了.覆盖上传;
File newFile=new File(path,filename);
try {
file.transferTo(newFile);
} catch (IOException e) {
e.printStackTrace();
}
//2显示到页面;
ModelAndView mv=new ModelAndView();
mv.addObject("path","/"+filename);
mv.setViewName("test");;
return mv;
}
@RequestMapping("/test")
public String test(){
return "test";
}
}
【版权声明】本文为华为云社区用户原创内容，转载时必须标注文章的来源（华为云社区）、文章链接、文章作者等基本信息， 否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容，欢迎发送邮件进行举报，并提供相关证据，一经查实，本社区将立刻删除涉嫌侵权内容，举报邮箱：
cloudbbs@huaweicloud.com
- 点赞
- 收藏
- 关注作者
评论（0）