JavaWeb(Maven)中存储图片到数据库并从数据库中显示到页面上

    在网上搜了很多,大多都是什么存储字节啥的,看起来很复杂。做课设的时候,从视频(乐字节-云R记)里看到了一个简洁、好理解的方法,其思路如下:

上传图片:
前台:
   表单类型 enctype="multipart/form-data" 提交方式 method="post"
后台:  
   注:文件上传必须在Servlet类上添加注解! @MultipartConfig 
        1. 获取Part对象 request.getPart("name"); name代表的是file文件域的name属性值
        2. 通过Part对象获取上传文件的文件名
        3. 判断文件名是否为空
        4. 获取文件存放的路径  WEB-INF/upload/目录中
        5. 上传文件到指定目录
        6. 更新用户头像 (将原本用户对象中的默认头像设置为上传的文件名)
        7. 调用Dao层的数据库更新方法,返回受影响的行数
        8. 判断受影响的行数
          如果大于0,则修改成功;否则修改失败
加载头像
    前台:
        设置img标签的src属性,请求后台加载头像
            src="user?actionName=userHead&imageName=图片名称" (通过el表达式熊session中获取)
    后台:
        1. 获取参数 (图片名称)
        2. 得到图片的存放路径 (request.getServletContext().getealPathR("/"))
        3. 通过图片的完整路径,得到file对象
        4. 通过截取,得到图片的后缀
        5. 通过不同的图片后缀,设置不同的响应的类型
        6. 利用FileUtils的copyFile()方法,将图片拷贝给浏览器
实现上上传文件代码:
try {
    // 1. 获取Part对象 request.getPart("name"); name代表的是file文件域的name属性值
    Part part = request.getPart("img");
    // 2. 通过Part对象获取上传文件的文件名 (从头部信息中获取上传的文件名)
    String header = part.getHeader("Content-Disposition");
    // 获取具体的请求头对应的值
    String str = header.substring(header.lastIndexOf("=") + 2);
    // 获取上传的文件名
    String fileName = str.substring(0, str.length() - 1);
    // 3. 判断文件名是否为空
    if (!StrUtil.isBlank(fileName)) {
        // 如果用户上传了头像,则更新用户对象中的头像
        user.setHead(fileName);
        // 4. 获取文件存放的路径  WEB-INF/upload/目录中
        String filePath = request.getServletContext().getRealPath("/WEb-INF/upload/");
        // 5. 上传文件到指定目录
        part.write(filePath + "/" + fileName);
    }
} catch (Exception e) {
    e.printStackTrace();
}

      对于加载头像总结一下(为啥不总结上传,因为我也不懂),其中这个数据库里的用户信息被包装在User类里,通过setAttribute()存在session的一属性中;EL表达式:${user.head}。(user为该User类名字,head是其一属性字段,其内存图片名)(注:通过web表单上传图像存储下来的也是该图的名字)。

      表单(用户信息表单,假设已经存在一个用户user)提交的动作为路径为user的servlet,并且传递了一个属性值actionname(=userhead)和一个图片名称,user检查到这个属性值后就会调用加载头像的函数。这个函数就是重点:

private void userHead(HttpServletRequest request, HttpServletResponse response) throws IOException {
        // 1. 获取参数 (图片名称)
        String head = request.getParameter("imageName");
        // 2. 得到图片的存放路径 (得到项目的真实路径:request.getServletContext().getealPathR("/"))
        String realPath = request.getServletContext().getRealPath("/WEB-INF/upload/");
        // 3. 通过图片的完整路径,得到file对象
        File file = new File(realPath + "/" + head);
        // 4. 通过截取,得到图片的后缀
        String pic = head.substring(head.lastIndexOf(".")+1);
        // 5. 通过不同的图片后缀,设置不同的响应的类型
        if ("PNG".equalsIgnoreCase(pic)) {
                response.setContentType("image/png");
        } else if ("JPG".equalsIgnoreCase(pic) || "JPEG".equalsIgnoreCase(pic)) {
                response.setContentType("image/jpeg");
        } else if ("GIF".equalsIgnoreCase(pic)) {
                response.setContentType("image/gif");
        }
        // 6. 利用FileUtils的copyFile()方法,将图片拷贝给浏览器
        FileUtils.copyFile(file, response.getOutputStream());
}

完球...还是看不懂啊。反正就这么傻粘就出来了...

  • 2
    点赞
  • 18
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
要实现将图片地址上传到数据库并从数据库获取地址进行显示,你可以按照以下步骤进行操作: 1. 创建数据库表,用于存储图片信息,表结构可以包含图片ID,图片名称,图片路径等字段。 2. 在前端页面,使用表单上传图片,然后将图片保存到服务器指定目录,并获取到图片路径。 3. 在后端代码,将图片路径保存到数据库,可以使用JDBC或者ORM框架进行数据库操作。 4. 在前端页面,通过后端接口从数据库获取图片路径,然后将图片显示页面上。 以下是一个基于Spring MVC和MyBatis框架的示例代码,用于上传图片并将图片路径保存到数据库: 前端页面: ``` <form method="post" action="/upload" enctype="multipart/form-data"> <input type="file" name="file" /> <input type="submit" value="Upload" /> </form> ``` 后端Controller: ``` @Controller public class UploadController { @Autowired private ImageService imageService; @PostMapping("/upload") public String upload(@RequestParam("file") MultipartFile file) { try { // 保存图片到服务器指定目录 String path = "D:/uploads/" + file.getOriginalFilename(); file.transferTo(new File(path)); // 将图片路径保存到数据库 Image image = new Image(); image.setName(file.getOriginalFilename()); image.setPath(path); imageService.saveImage(image); } catch (IOException e) { e.printStackTrace(); } return "redirect:/"; } } ``` Service: ``` @Service public class ImageService { @Autowired private ImageMapper imageMapper; public void saveImage(Image image) { imageMapper.insert(image); } public Image getImageById(Long id) { return imageMapper.selectById(id); } } ``` Mapper: ``` @Mapper public interface ImageMapper { @Insert("insert into image (name, path) values (#{name}, #{path})") void insert(Image image); @Select("select * from image where id = #{id}") Image selectById(Long id); } ``` 最后,在前端页面,通过后端接口获取图片路径,并将图片显示页面上: ``` <img src="/image?id=1" /> ``` Controller: ``` @Controller public class ImageController { @Autowired private ImageService imageService; @GetMapping("/image") public void getImage(@RequestParam("id") Long id, HttpServletResponse response) { Image image = imageService.getImageById(id); try { OutputStream out = response.getOutputStream(); FileInputStream in = new FileInputStream(new File(image.getPath())); byte[] buffer = new byte[1024]; int len = 0; while ((len = in.read(buffer)) != -1) { out.write(buffer, 0, len); } in.close(); out.close(); } catch (IOException e) { e.printStackTrace(); } } } ``` 这样就可以实现将图片地址上传到数据库并从数据库获取地址进行显示了。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值