Java实现数据库图片上传功能详解

2025-03-15 01:50

本文主要是介绍Java实现数据库图片上传功能详解,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

《Java实现数据库图片上传功能详解》这篇文章主要为大家详细介绍了如何使用Java实现数据库图片上传功能,包含从数据库拿图片传递前端渲染,感兴趣的小伙伴可以跟随小编一起学习一下...

1、前言

我们使用数据库经常传递字符串、数字,但是很少在数据库存储图片、Word文件,我也去网上找了找其他人的文章,只能说这类型的少的可怜,不是收费,就是讲的乱七八糟。既然如此,那么我将为需要这方面知识点的朋友写下这篇文章。本篇文章我们从以下几个方面:

1、数据库搭建

2、后端实现,将图片存储进数据库

3、后端实现,从数据库取出图片给前端

4、前端拿到后端传递的json信息渲染到网页

废话不多说,直接开始!

2、数据库搭建 

本次数据库我们选择比较经典的mysql(只是因为我只会这个),mysql提供一个字段类型叫做

blob,对于这个字段类型,我就不过多详细叙述,csdn博客上有,各位可以去看看。

建表语句:

create table test2(
    id int auto_increment primary key ,
    name varchar(100) comment '名称',
    photo blob comment '照片'
)

Java实现数据库图片上传功能详解

 3、后端实现将图片存储进数据库

思想:

实际上我们可以通过字节流的形式,将图片转成二进制,然后将其保存在数据库里面。我们按照以下步骤:

1、找到图片位置

2、图片转为Fileinputstream流

3、存储数据库

找到图片位置(如下图操作)

Java实现数据库图片上传功能详解

图片转为Fileinputstream流的工具类(可直接copy)

package com.example.jishedemo2.img;
 
import Java.io.*;
 
public class imgeuntil {
    /**
     * @author Administrator
     *
     */
 
 
        // 读取本地图片获取输入流
        public static FileInputStream readImage(String path) throws IOException {
            return new FileInputStream(new File(path));
        }
 
        // 读取表中图片获取输出流
        public static void readBin2Image(InputStream in, String targetPath) {
            File file = new File(targetPath);
            String path = targetPath.substring(0, targetPath.lastIndexOf("/"));
            if (!file.exists()) {
                new File(path).mkdir();
            }
            FileOutputStream fos = null;
            try {
                fos = new FileOutputStream(file);
                int len = 0;
                byte[] buf = new byte[1024];
                while ((len = in.read(buf)) != -1) {
                    fos.write(buf, 0, len);
                }
                fos.flush();
            } catch (Exception e) {
                e.printStackTrace();
            } finally {
                if (null != fos) {
                    try {
                        fos.close();
                  http://www.chinasem.cn  } catch (IOException e) {
                        e.printStackTrace();
                    }
                }
            }
        }
    }

存储数据库

mapper层:

package com.example.jishedemo2.img;
 
import org.apache.iBATis.annotations.Insert;
import org.apache.ibatis.annotations.Mapper;
import org.apache.ibatis.annotations.Select;
 
import java.io.FileInputStream;
import java.io.InputStream;
import java.util.List;
 
@Mapper
public interface imagemapper {
 
 @Insert("insert into test2 values(null,#{name},#{photo})")
 void inser(String name,  FileInputStream photo);
 
}

service层:

package com.example.jishedemo2.img;
 
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
 
import java.io.FileInputStream;
import java.util.List;
 
@Service
public class imageservice implements imge{
 
    @Autowired
    private imagemapper imagemapper;
 
    @Override
    public void inser(String name, FileInputStream file) {
        imagemapper.inser(name,file);
    }
 
}

control层:

package com.example.jishedemo2.img;
 
import com.example.jishedemo2.dao.Result;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RestController;
 
import java.io.FileInputStream;
import java.io.IOException;
import java.sql.PreparedStatement;
import java.util.List;
 
@RestController
public class imgedemo {
    @Autowired
    private imageservice imageservice;
 
    // 将图片插入数据库
    @PostMapping("test3")
    public  void readImage2DB() throws IOException {
        String path = "D:\\wsstext.png";
        try {
            FileInputStream in = null;
            in = imgeuntil.readImage(path);
            imageservice.inser("测试",in);
            in.close();
        } catch (IOException e) {
            e.printStackTrace();
        }
    }
 
   
}

没什么好说的,如果你不会javaweb,这边建议先去把javaweb学了。

Java实现数据库图片上传功能详解

4、后端实现从数据库取出图片给前端

(可直接看这个,这个给的是所有代码)

这一步,多了一点,我们需要写一个类与数据库的表字段统一(dao层)

dao层:

package com.example.jishedemo2.img;
 
import java.io.FileInputStream;
import java.io.InputStream;
 
public class photo {
    int id;
    String name;
    byte[] photo;
 
    public photo() {
    }
 
    public photo(int id, String name, byte[] photo) {
        this.id = id;
        this.name = name;
        this.photo = photo;
    }
 
    /**
     * 获取
     * @return id
     */
    public int getId() {
        return id;
    }
 
    /**
     * 设置
     * @param id
     */
    puhttp://www.chinasem.cnblic void setId(int id) {
        this.id = id;
    }
 
    /**
     * 获取
     * @return name
     */
    public String getName() {
        return name;
    }
 
    /**
     * 设置
     * @param name
     */
    public void setName(String name) {
        this.name = name;
    }
 
    /**
     * 获取
     * @return photo
     */
    public byte[] getPhoto() {
        return photo;
    }
 
    /**
     * 设置
     * @param photo
     */
    publjavascriptic void setPhoto(byte[] photo) {
        this.photo = photo;
    }
 
    public String toString() {
        return "photo{id = " + id + ", name = " + name + ", photo = " + photo + "}";
    }
}

mapper层:

package com.example.jishedemo2.img;
 
import org.apache.ibatis.annotations.Insert;
import org.apache.ibatis.annotations.Mapper;
import org.apache.ibatis.annotations.Select;
 
import java.io.FileInputStream;
import java.io.InputStream;
import java.util.List;
 
@Mapper
public interface imagemapper {
 
 @Insert("insert into test2 values(null,#{name},#{photo})")
 void inser(String name,  FileInputStream photo);
 
 @Select("select * from test2")
 List<photo> select();
 
 
}

service层:

package com.example.jishedemo2.img;
 
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
 
import java.io.FileInputStream;
import java.util.List;
 
@Service
public class imageservice implements imge{
 
    @Autowired
    private imagemapper imagemapper;
 
    @Override
    public void inser(String name, FileInputStream file) {
        imagemapper.inser(name,file);
    }
 
    @Override
    public List<photo> select() {
        return imagemapper.select();
    }
}

control层:

package com.example.jishedemo2.img;
 
import com.example.jishedemo2.dao.Result;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RestController;
 
import java.io.FileInputStream;
import java.io.IOException;
import java.sql.PreparedStatement;
import java.util.List;
 
@RestController
public class imgedemo {
    @Autowired
    private imageservice imageservice;
 
    // 将图片插入数据库
    @PostMapping("test3")
    public  void readImage2DB() throws IOException {
        String path = "D:\\wsstext.png";
        PreparedStatement ps = null;
        try {
            FileInputStream in = null;
            in = imgeuntil.readImage(path);
            imageservice.inser("测试",in);
            in.close();
        } catch (IOException e) {
            e.printStackTrace();
        }
    }
 
    //传数据
    @PostMapping("test4")
    public Result select(){
 
        List<photo> photos = imageservice.select();
 
        return Result.success(photos);
    }
 
 
}

前端拿到效果: 

Java实现数据库图片上传功能详解

5、前端拿到后端传递的json信息渲染到网页

 对于新手前端拿到photo,可能会很蒙蔽不知道这个是什么,我这里简要说一下:

解释 :

这段文本是一个html (HyperText Markup Language) 编码的字符串,它嵌入了一个Base64编码的图像数据(以data:image/png;base64,开头的部分,但在这个示例中被截断了),并包含了一些css (Cascading Style Sheets) 样式和javascript(虽然直接看起来并不包含JavaScript代码,但可能是在某处被引用或嵌入的)。

具体来说,这个字符串包含以下几个部分:

Base64编码的图像数据:这部分以data:image/png;base64,开头,后跟一长串字符,这些字符是图像的二进制数据经过Base64编码后的结果。

CSS样式:字符串中包含了一些CSS样式,如i标签的样式定义(i { ... }),这些样式可能用于控制HTML文档中元素的显示方式。但在这个示例中,CSS样式是直接嵌入在HTML中的,并且由于格式和上下文的原因,可能不完整或难以直接应用

HTML结构:字符串中包含了HTML的基本结构,如<div><span>等标签,以及自定义的类或ID属性(如class="..."id="..."),这些用于在CSS中引用并应用样式。

JavaScript的引用或嵌入:虽然直接在这个字符串中没有看到JavaScript代码,但通常HTML页面会包含JavaScript代码或引用外部JavaScript文件来控制页面的行为。这个字符串可能只是HTML页面的一部分,而JavaScript代码可能位于其他位置。

特殊字符和注释:字符串中还包含了一些特殊字符(如//开头的注释)和格式化字符(如换行符\n),这些在HTML和CSS中用于提高代码的可读性和可维护性。

综上所述,这段文本是一个HTML编码的字符串,它结合了Base64编码的图像数据、CSS样式和HTML结构,可能还隐式地引用了JavaScript代码。这种格式常用于在网页中嵌入图像、样式和脚本,以实现丰富的视觉效果和交互功能。

如何实现渲染在网页:

在前端网页中嵌入使用Base64编码的图像字符串,可以直接将这个字符串作为<img>标签的src属性的值。由于Base64编码的图像数据被封装在data: URL中,浏览器可以直接解析这个URL并将其作为图像内容显示在页面上,而无需从外部服务器加载图像。

以下是一个该字符串在前端网页中嵌入图像的示例:

<template>
   <div>  
    <img v-if="imageUrl" :src="imageUrl" alt="Java实现数据库图片上传功能详解" />  
  </div>  
</template>
 
<script>
import axIOS from 'axios'
export default {
  data() {
    return {
      imageUrl: null
    }
  },
  mounted(){
    
javascript    axios.post("http://localhost:8080/test4").then((e) => {
      this.imageUrl= "data:image/png;base64," + e.data.data[0].photo;
    })
  
}

以上就是Java实现数据库图片上传功能详解的详细内容,更多关于Java数据库图片上传的资料请关注China编程(www.chinasem.cn)其它相关文章!

这篇关于Java实现数据库图片上传功能详解的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1153751

相关文章

HTML5 搜索框Search Box详解

《HTML5搜索框SearchBox详解》HTML5的搜索框是一个强大的工具,能够有效提升用户体验,通过结合自动补全功能和适当的样式,可以创建出既美观又实用的搜索界面,这篇文章给大家介绍HTML5... html5 搜索框(Search Box)详解搜索框是一个用于输入查询内容的控件,通常用于网站或应用程

Java对异常的认识与异常的处理小结

《Java对异常的认识与异常的处理小结》Java程序在运行时可能出现的错误或非正常情况称为异常,下面给大家介绍Java对异常的认识与异常的处理,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参... 目录一、认识异常与异常类型。二、异常的处理三、总结 一、认识异常与异常类型。(1)简单定义-什么是

SpringBoot项目配置logback-spring.xml屏蔽特定路径的日志

《SpringBoot项目配置logback-spring.xml屏蔽特定路径的日志》在SpringBoot项目中,使用logback-spring.xml配置屏蔽特定路径的日志有两种常用方式,文中的... 目录方案一:基础配置(直接关闭目标路径日志)方案二:结合 Spring Profile 按环境屏蔽关

Python实现精准提取 PDF中的文本,表格与图片

《Python实现精准提取PDF中的文本,表格与图片》在实际的系统开发中,处理PDF文件不仅限于读取整页文本,还有提取文档中的表格数据,图片或特定区域的内容,下面我们来看看如何使用Python实... 目录安装 python 库提取 PDF 文本内容:获取整页文本与指定区域内容获取页面上的所有文本内容获取

基于Python实现一个Windows Tree命令工具

《基于Python实现一个WindowsTree命令工具》今天想要在Windows平台的CMD命令终端窗口中使用像Linux下的tree命令,打印一下目录结构层级树,然而还真有tree命令,但是发现... 目录引言实现代码使用说明可用选项示例用法功能特点添加到环境变量方法一:创建批处理文件并添加到PATH1

Java使用HttpClient实现图片下载与本地保存功能

《Java使用HttpClient实现图片下载与本地保存功能》在当今数字化时代,网络资源的获取与处理已成为软件开发中的常见需求,其中,图片作为网络上最常见的资源之一,其下载与保存功能在许多应用场景中都... 目录引言一、Apache HttpClient简介二、技术栈与环境准备三、实现图片下载与保存功能1.

Python中使用uv创建环境及原理举例详解

《Python中使用uv创建环境及原理举例详解》uv是Astral团队开发的高性能Python工具,整合包管理、虚拟环境、Python版本控制等功能,:本文主要介绍Python中使用uv创建环境及... 目录一、uv工具简介核心特点:二、安装uv1. 通过pip安装2. 通过脚本安装验证安装:配置镜像源(可

C++ 函数 strftime 和时间格式示例详解

《C++函数strftime和时间格式示例详解》strftime是C/C++标准库中用于格式化日期和时间的函数,定义在ctime头文件中,它将tm结构体中的时间信息转换为指定格式的字符串,是处理... 目录C++ 函数 strftipythonme 详解一、函数原型二、功能描述三、格式字符串说明四、返回值五

LiteFlow轻量级工作流引擎使用示例详解

《LiteFlow轻量级工作流引擎使用示例详解》:本文主要介绍LiteFlow是一个灵活、简洁且轻量的工作流引擎,适合用于中小型项目和微服务架构中的流程编排,本文给大家介绍LiteFlow轻量级工... 目录1. LiteFlow 主要特点2. 工作流定义方式3. LiteFlow 流程示例4. LiteF

canal实现mysql数据同步的详细过程

《canal实现mysql数据同步的详细过程》:本文主要介绍canal实现mysql数据同步的详细过程,本文通过实例图文相结合给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的... 目录1、canal下载2、mysql同步用户创建和授权3、canal admin安装和启动4、canal