springmvc+mybatis 处理图片(一)：上传图片
一直觉得上传图片文件之类的很难，所以最后才处理图片，发现也并没有那么难，开始正文。
思路：将前台上传的file存到MutipartFile类型字段中，再将MulipartFile转换为pojo类中的byte[ ]数组，最后存入数据库longBlob类型字段中
1. 数据库设计，将图片newsPic字段类型设置为longblob或blob
2. 准备jar包：commons-fileupload和commons-io，我用的是commons-fileupload-1.3.1.jar和commons-io-2.4.jar，也可以在这里下载。
3. 在springmvc-config.xml中进行上传文件的配置
<!-- 对上传文件的配置 -->
<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
<property name="defaultEncoding">
<value>UTF-8</value>
</property>
<property name="maxUploadSize">
<value>32505856</value><!-- 上传文件大小限制为31M，31*1024*1024 -->
</property>
<property name="maxInMemorySize">
<value>4096</value>
</property>
</bean>
form表单里面有文件上传时，必须要指定enctype属性值为multipart/form-data，意思是以二进制流的形式传输文件。否则会报错上传不了。
而因为在form表单中增加了：enctype="multipart/form-data"这个属性，会将数据转换为二进制，导致接收到的值都为空值，因此要在spring的配置文件中配置multipartResolver
4. addNews.jsp
<form action="addNewst" method="post" enctype="multipart/form-data">
<table>
<tr>
<td>
<input type="file" size="50" name="newsPicture"/>
</td>
</tr>
<!--省略其他字段的代码-->
</table>
</form>
5. NewsMapper.java和NewsDynaSqlProvider.java
(1) NewsMapper.java
//动态插入新闻
@SelectProvider(type=NewsDynaSqlProvider.class,method="insertNews")
void save(News news);
(2) NewsDynaSqlProvider.java
//动态插入
public String insertNews(final News news){
return new SQL(){
{
INSERT_INTO("news");
if(news.getNewsTitle() != null && !news.getNewsTitle().equals("")){
VALUES("newsTitle", "#{newsTitle}");
}
if(news.getNewsAbstract() != null && !news.getNewsAbstract().equals("")){
VALUES("newsAbstract", "#{newsAbstract}");
}
if(news.getNewsAuthor() != null && !news.getNewsAuthor().equals("")){
VALUES("newsAuthor", "#{newsAuthor}");
}
if(news.getNewsTime() != null && !news.getNewsTime().equals("")){
VALUES("newsTime", "#{newsTime}");
}
if(news.getNewsContent() != null && !news.getNewsContent().equals("")){
VALUES("newsContent", "#{newsContent}");
}
if(news.getNewsPic() != null && !news.getNewsPic().equals("")){
VALUES("newsPic", "#{newsPic,jdbcType=BLOB}");
}
}
}.toString();
}
6. TestService.java和TestServiceImpl.java
(1) TestService.java
/**
* 添加新闻
* @param News 新闻对象
* @MultipartFile newsPic 新闻图片
* @throws Exception
*/
void addNewsAndPic(News news, MultipartFile newsPic) throws Exception;
(2) TestServiceImpl.java
@Override
public void addNewsAndPic(News news, MultipartFile newsPic) throws Exception {
byte[] b1 = newsPic.getBytes();
news.setNewsPic(b1);
newsMapper.save(news);
}
7. NewsController.java
/**
* 处理添加请求
* @param String flag 标记， 1表示跳转到添加页面，2表示执行添加操作
* @param News news 要添加的新闻对象
* @param ModelAndView mv
* @throws Exception
* */
@RequestMapping(value="/addNewst")
public ModelAndView addNewst(String flag, @ModelAttribute News news, MultipartFile newsPicture, ModelAndView mv, HttpSession session) throws Exception{
if(flag.equals("1")){
mv.setViewName("addNews");
}else{
testService.addNewsAndPic(news, newsPicture);
mv.setViewName("redirect:/htNews");
}
return mv;
}
SpringMVC中从前台到后台通过表单传递数据：
(1) 表单的name属性值必须和接受的参数同名。否则，接收到的参数为null
(2) 表单的name属性值必须和接收对象的属性同名。否则，接收到的参数为null
8. News.java
public class News implements Serializable{
private Integer newsID;
private String newsTitle;
private String newsAbstract;
private String newsAuthor;
@DateTimeFormat(pattern="yyyy-MM-dd HH:mm:ss")
private Date newsTime;
private String newsContent;
private byte[] newsPic;//新闻照片
public News(){
super();
}
//setter and getter
}
参考：https://blog.csdn.net/j277699931/article/details/50413864
二、.jsp改进，读取input:file的路径后，显示本地图片
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>title</title>
<style type="text/css">
#imagePreview {
width: 160px;
height: 120px;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale);
}
</style>
</head>
<body>
<form action="addNewst" id="newsForm" method="post" enctype="multipart/form-data">
<table>
<tr>
<td>
<div id="imagePreview"></div>
<input id="imageInput" type="file" size="50" name="newsPicture" onchange="loadImageFile()"/>
</td>
</tr>
<!--省略其他代码-->
</table>
</form>
<script type="text/javascript">
var loadImageFile = (function () {
if (window.FileReader) {
var oPreviewImg = null, oFReader = new window.FileReader(),
rFilter = /^(?:image\/bmp|image\/cis\-cod|image\/gif|image\/ief|image\/jpeg|image\/jpeg|image\/jpeg|image\/pipeg|image\/png|image\/svg\+xml|image\/tiff|image\/x\-cmu\-raster|image\/x\-cmx|image\/x\-icon|image\/x\-portable\-anymap|image\/x\-portable\-bitmap|image\/x\-portable\-graymap|image\/x\-portable\-pixmap|image\/x\-rgb|image\/x\-xbitmap|image\/x\-xpixmap|image\/x\-xwindowdump)$/i; oFReader.onload = function (oFREvent) {
if (!oPreviewImg) {
var newPreview = document.getElementById("imagePreview");
oPreviewImg = new Image();
oPreviewImg.style.width = (newPreview.offsetWidth).toString() + "px";
oPreviewImg.style.height = (newPreview.offsetHeight).toString() + "px";
newPreview.appendChild(oPreviewImg);
}
oPreviewImg.src = oFREvent.target.result;
}; return function () {
var aFiles = document.getElementById("imageInput").files;
if (aFiles.length === 0) { return; }
if (!rFilter.test(aFiles[0].type)) { alert("You must select a valid image file!"); return; }
oFReader.readAsDataURL(aFiles[0]);
} }
if (navigator.appName === "Microsoft Internet Explorer") {
return function () {
alert(document.getElementById("imageInput").value);
document.getElementById("imagePreview").filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = document.getElementById("imageInput").value; }
}
})();
</script>
</body>
</html>
效果如图：
参考：https://blog.csdn.net/dracotianlong/article/details/38046939
------------------------------------------------------分界线------------------------------------------------------------
遇到的错误：
1. SpringMVC表单提交后，Controller接收到的值都是null，如图
报错如下：
四月 13, 2018 10:43:33 上午 org.apache.catalina.core.StandardWrapperValve invoke
严重: Servlet.service() for servlet [springmvc] in context with path [/SpringDemo] threw exception [Request processing failed; nested exception is java.lang.NullPointerException] with root cause
java.lang.NullPointerException
at com.game.controller.NewsController.addNewst(NewsController.java:58)
原因：没有配置multipartResolver，参考：https://blog.csdn.net/MODjie/article/details/79076455
2. 点击”新闻管理“的界面，就在显示图片的controller中报空指针异常java.lang.NullPointerException，但是页面的所有功能都能正常使用，开始始终不明白怎么回事，后来发现是因为有的新闻没有添加图片，造成在加载页面获取新闻的二进制文件流时报空指针异常。
java.lang.NullPointerException
at java.io.ByteArrayInputStream.<init>(ByteArrayInputStream.java:106)
at com.game.controller.NewsController.newsPic(NewsController.java:105)
如图：
------------------------------------------------------分界线------------------------------------------------------------
Mysql中的BLOB数据类型
在计算机中，BLOB是数据库中经常用来存储二进制文件的字段类型，典型的BLOB是一张图片或一个声音文件。
MySQL中，BLOB是个类型系列，包括：TinyBlob、Blob、MediumBlob、LongBlob，这几个类型之间的唯一区别是存储文件的最大大小的不同。
| 类型 | 大小(单位：字节) |
| TinyBlob | 最大 255 |
| Blob | 最大 65K |
| MediumBlob | 最大 16M |
| LongBlob | 最大 4G |
springmvc+mybatis 处理图片(一)：上传图片的更多相关文章
- springmvc+mybatis 处理图片(二)：显示图片
数据库及配置文件等参考:springmvc+mybatis 处理图片(一):上传图片思路:把图片二进制信息写入到HttpServletResponse 的outputStream输出流中来显示图片.一 ...
- 关于CKEditor4.5.6的使用，自定义toolbar配置，上传图片案例（SpringMVC+MyBatis案例），自定义行高，去编辑器的中内容，将编辑器中内容设置到指定的位置等
关于CKEditor的一个配置整理,改文件为config.js: 文件内容如下: /** * @license Copyright (c) 2003-2016, CKSource - Frede ...
- springmvc+mybatis+spring 整合源码项目
A集成代码生成器 [正反双向(单表.主表.明细表.树形表,开发利器)+快速构建表单; freemaker模版技术 ,0个代码不用写,生成完整的一个模块,带页面.建表sql脚本,处理类,service等 ...
- springmvc+mybatis+spring 整合
获取[下载地址] [免费支持更新]三大数据库 mysql oracle sqlsever 更专业.更强悍.适合不同用户群体[新录针对本系统的视频教程,手把手教开发一个模块,快速掌握本系统] ...
- springmvc+mybatis+spring 整合 bootstrap
获取[下载地址] [免费支持更新]三大数据库 mysql oracle sqlsever 更专业.更强悍.适合不同用户群体[新录针对本系统的视频教程,手把手教开发一个模块,快速掌握本系统] ...
- Spring+SpringMVC+MyBatis+easyUI整合优化篇（七）图片上传功能
日常啰嗦 前一篇文章<Spring+SpringMVC+MyBatis+easyUI整合优化篇(六)easyUI与富文本编辑器UEditor整合>讲了富文本编辑器UEditor的整合与使用 ...
- Spring+SpringMVC+MyBatis深入学习及搭建(十六)——SpringMVC注解开发（高级篇）
转载请注明出处:http://www.cnblogs.com/Joanna-Yan/p/7085268.html 前面讲到:Spring+SpringMVC+MyBatis深入学习及搭建(十五)——S ...
- shiro与Web项目整合-Spring+SpringMVC+Mybatis+Shiro(八)
Jar包
- SSM三大框架整合详细教程（Spring+SpringMVC+MyBatis）【转】
使用SSM(Spring.SpringMVC和Mybatis)已经有三个多月了,项目在技术上已经没有什么难点了,基于现有的技术就可以实现想要的功能,当然肯定有很多可以改进的地方.之前没有记录SSM整合 ...
随机推荐
- 【转】将Centos的yum源更换为国内的阿里云源
摘要: 阿里云是最近新出的一个镜像源.得益于阿里云的高速发展,这么大的需求,肯定会推出自己的镜像源. 阿里云Linux安装镜像源地址:http://mirrors.aliyun.com/ CentOS ...
- Linux之linux入门
学习linux之前先了解一下操作系统: 操作系统的定义: 操作系统(英语:operating system,缩写作 OS)是管理计算机硬件与软件资源的计算机程序,同时也是计算机系统的内 ...
- Ubuntu根目录下各文件夹的作用
Ubuntu上常识和常用命令: 1.Ubuntu文件结构 在ubuntu上硬盘的目录和Windows上不同,Windows可以根据自己的需求分不同的盘符,但ubuntu上只有一个盘,从根目录开始每个目 ...
- ubuntu/linux中安装Tomcat(附图解详细步骤)
我的linux系统使用的是ubuntu14 1.首先需要先到Tomcat官网上下载对应linux系统的压缩包,可以直接在Ubuntu系统中进行下载,下载后的默认路径为主文件夹路径下的下载文件目录下 注 ...
- 凡事不求甚解，遇事必定抓瞎——PHP开发Apache服务器配置备忘录
照此配置流程,绝对一路畅通,可保无虞. 昨天弄了个PHP小程序,想在本地跑一下测试,可是工作电脑没有安装环境,于是下载了一个wamp,一路畅通,Apache.Mysql.PHP就全有了.启动wamp服 ...
- sqlplus远程连接oracle
格式: sqlplus 用户名/密码@192.168.19.189:1521/MYTEST MYTEST 数据库名称
- Redux和React-Redux的实现（三）：中间件的原理和applyMiddleware、Thunk的实现
现在我们的Redux和React-Redux已经基本实现了,在Redux中,触发一个action,reducer立即就能算出相应的state,如果我要过一会才让reducer计算state呢怎么办?也 ...
- DB2分页查询简单示例
select * from ( select a.* ,rownumber() over(order by create_time desc) as rowid from ( select * fro ...
- 再学HTML之一
Html 超文本标记语言 什么是html? HTML 是用来描述网页的一种语言. HTML 指的是超文本标记语言 (Hyper Text Markup Language) HTML 不是一种编程语言, ...
- PMS---团队展示
点我查看作业原题 [队名] PMS(一群pm) [拟做的团队项目描述] 基于监控场景的视频摘要与人车检测跟踪系统 A system, under monitor scene, for video su ...