您的位置:首页 > 编程语言 > Java开发

SpringMVC Mybatis MySQL实现图片存储到数据库及读取显示缩微图

2014-11-27 20:43 621 查看
1、数据库建表语句:其中红色部分为存储图片的字段;

CREATE TABLE `show_picture` (

  `id` int(11) NOT NULL AUTO_INCREMENT COMMENT '主键',

  `type` varchar(20) DEFAULT NULL COMMENT '类型,作品:WORK ;客片:GUEST',

  `title` varchar(20) DEFAULT NULL COMMENT '标题',

  `description` varchar(200) DEFAULT NULL COMMENT '描述',

  `style_type` int(11) DEFAULT NULL COMMENT '对应风格分类',

  `place_type` int(11) DEFAULT NULL COMMENT '对应场景分类',

  `enjoy_type` int(11) DEFAULT NULL COMMENT '对应欣赏分类',
  `picture` longblob COMMENT '对应图片',

  `for_first_pic` longblob COMMENT '对应首页图片(只对服务报价推荐到首页有效)',

  `for_related_pic` longblob COMMENT '对应相关作品详细页面图片',

  `create_time` datetime DEFAULT NULL COMMENT '创建时间',

  `sort` int(11) DEFAULT '0' COMMENT '排序',

  `var_temp` varchar(20) DEFAULT NULL COMMENT '字符型备用字段',

  `int_temp` int(11) DEFAULT NULL COMMENT '数字型备用字段',

  PRIMARY KEY (`id`)

) ENGINE=InnoDB DEFAULT CHARSET=utf8;

2、自动生成实体类

public class ShowPicture {

    private Integer id;

    private String type;

    private String title;

    private String description;

    private Integer styleType;

    private Integer placeType;

    private Integer enjoyType;

    private Date createTime;

    private Integer sort;

    private String varTemp;

    private Integer intTemp;



这是基本字段,具体存储图片的为blog类型,自动生成代码时,blog类型的字段会自动生成子类继承基本类

public class ShowPictureWithBLOBs extends ShowPicture {

    private byte[] picture;

    private byte[] forFirstPic;

    private byte[] forRelatedPic;

}

set、get方法自己完善;

3、因为前台传到controller中的附件要以MultipartFile类型,所以设置一个同样继承基本类的子类,和ShowPictureWithBLOBs字段一样,字段类型为MultipartFile,具体如下:

public class ShowPictureWithBLOBsUseMultipartFile extends ShowPicture {

    

    private MultipartFile  pictureFile;

    private MultipartFile forFirstPicFile;

    private MultipartFile forRelatedPicFile;



4、前台图片上传控件

 <div id = "uploadFile2">

         <div class="form-group mno file">

                  <label for="forFirstPicFile" class="col-sm-1 control-label" style="text-align:left;width:100px;">对应首页图片</label>

                   <div class="col-sm-3" style="margin-top:7px;">

                             <input  id="forFirstPicFile" name="forFirstPicFile" type="file">

                     </div>

          </div>

   </div>

其中,要注意的是form表单类型要multipart类型,如下

<form id="myform1"  action="$!{appRoot}/showpic/$!{method}.do"
enctype="multipart/form-data" class="form-horizontal" role="form" method="post">

5、controller层接收并处理数据,

@RequestMapping(value="/create.do",method=RequestMethod.POST)

    public String showpic_create_post(Model model,

            ShowPictureWithBLOBsUseMultipartFile showPic) throws IOException{

        logger.info("showpic_create_post start");

        model.addAttribute("zhStr", ShowPictureType.valueOf(showPic.getType()));

        

        //将相应文件(图片)取得inputStream

        InputStream isPictureFile = showPic.getPictureFile().getInputStream();  

        InputStream isForFirstPictureFile = showPic.getForFirstPicFile().getInputStream();  

        InputStream isForRelatedPictureFile = showPic.getForRelatedPicFile().getInputStream();

        

        byte[] pictureData = new byte[(int) showPic.getPictureFile().getSize()];  

        byte[] forFirstPictureData = new byte[(int) showPic.getForFirstPicFile().getSize()];  

        byte[] forRelatedPictureData = new byte[(int) showPic.getForRelatedPicFile().getSize()];  

        

        isPictureFile.read(pictureData);

        isForFirstPictureFile.read(forFirstPictureData);

        isForRelatedPictureFile.read(forRelatedPictureData);

        /**

         * 将ShowPictureWithBLOBsUseMultipartFile类型的实体转换成能够存入到数据库中的ShowPictureWithBLOBs类型

         */

        ShowPictureWithBLOBs spwb = new ShowPictureWithBLOBs();

        spwb.setCreateTime(showPic.getCreateTime());

        spwb.setEnjoyType(showPic.getEnjoyType());

        spwb.setForFirstPic(forFirstPictureData);

        spwb.setForRelatedPic(forRelatedPictureData);

        spwb.setId(showPic.getId());

        spwb.setIntTemp(showPic.getIntTemp());

        spwb.setPicture(pictureData);

        spwb.setPlaceType(showPic.getPlaceType());

        spwb.setSort(showPic.getSort());

        spwb.setStyleType(showPic.getStyleType());

        spwb.setTitle(showPic.getTitle());

        spwb.setType(showPic.getType());

        spwb.setVarTemp(showPic.getVarTemp());

        

        showPicBiz.createNewShowPic(spwb);

        logger.info("showpic_create_post end");

        return "redirect:/showpic/list.do?type="+spwb.getType();

        

    }

到此,已经能把数据存入到数据库中。

6、将图片取出并显示到页面。后台处理

 @RequestMapping(value="/getPhoto.do",method=RequestMethod.GET)

    public void getPhotoById (int id, int width, int height, final HttpServletResponse response) throws IOException{  

        ShowPictureWithBLOBs entity = this.showPicBiz.findShowPicById(id);  

        byte[] data = entity.getPicture();  

        if (width != 0 && height != 0) {  

            data = scaleImage(data, width, height);  

        }

        response.setContentType("image/jpeg");  

        response.setCharacterEncoding("UTF-8");  

        OutputStream outputSream = response.getOutputStream();  

        InputStream in = new ByteArrayInputStream(data);  

        int len = 0;  

        byte[] buf = new byte[1024];  

        while ((len = in.read(buf, 0, 1024)) != -1) {  

            outputSream.write(buf, 0, len);  

        }  

        outputSream.close();  

    }  

    /**

     * 显示缩微图

     * TODO

     * @param data

     * @param width

     * @param height

     * @return

     * @throws IOException<br/>

     * ============History===========<br/>

     * 2014年11月27日   Administrator    新建

     */

    public static byte[] scaleImage(byte[] data, int width, int height) throws IOException {  

        BufferedImage buffered_oldImage = ImageIO.read(new ByteArrayInputStream(data));  

        int imageOldWidth = buffered_oldImage.getWidth();  

        int imageOldHeight = buffered_oldImage.getHeight();  

        double scale_x = (double) width / imageOldWidth;  

        double scale_y = (double) height / imageOldHeight;  

        double scale_xy = Math.min(scale_x, scale_y);  

        int imageNewWidth = (int) (imageOldWidth * scale_xy);  

        int imageNewHeight = (int) (imageOldHeight * scale_xy);  

        BufferedImage buffered_newImage = new BufferedImage(imageNewWidth, imageNewHeight, BufferedImage.TYPE_INT_RGB);  

        buffered_newImage.getGraphics().drawImage(buffered_oldImage.getScaledInstance(imageNewWidth, imageNewHeight, BufferedImage.SCALE_SMOOTH), 0, 0, null);  

        buffered_newImage.getGraphics().dispose();  

        ByteArrayOutputStream outPutStream = new ByteArrayOutputStream();  

        ImageIO.write(buffered_newImage, "jpeg", outPutStream);  

        return outPutStream.toByteArray();  

    } 
7、前台显示

<img src="$!{appRoot}/showpic/getPhoto.do?id=$!showpic.id&width=150&height=150"/>

                                 
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: