Java直接将图片保存到数据库 java将图片存入mysql数据库

html代码：
注意：Img标签双击事件(ondblclick)传的值需和input标签改变事件(onchange) 传的值与input的id一致！

<div class="" style="height: 85px; width: 85px;">
    <img src=" " alt="" width="100%" height="100%" id="UsImgStudentPicture" class="border border-primary ml-1" ondblclick="chooseImageFile('Picture')" />
    <input type="file" name="fileStudentImage" id="Picture" hidden="hidden" accept="image/*" onchange="showImgToView('Picture')" />
</div>

js代码：
通过文件获取的接口来获取选择的图片并显示出来，选择照片:用FileReader对象来读取本地数据，并且将数据结果赋值给image的src

//打开file表单,选择图片
function chooseImageFile(inputFileID) {
    $("#" + inputFileID).click();
}
//创建FileReader对象
//FileReader接口提供了一个异步的API，通过这个API可以从浏览器中异步访问文件系统中的数据。因此，FileReader接口可以读取文件中的数据，并将读取的数据放入到内存中去
var imgReader = new FileReader();

//正则表达式 过滤图片文件
regexImageFilter = /^(?: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;

//file表单改变事件，将选择的图片显示到img元素
function showImgToView(inputFileId) {
    //选择图片文件
    var imgFile = $("#" + inputFileId).get(0).files[0]; 
    //判断上传文件是否为图片格式
    if (!regexImageFilter.test(imgFile.type)) {
        layer.msg("请选择有效的图片文件", { icon: 0, title: "提示" });
    }
    else {
        //readAsDataURL()方法可以获取API异步读取的文件数据，另存为数据URL;
        //FileReader对象的readAsDataURL方法可以将读取到的文件编码成Data URL。Data URL是一项特殊的技术，可以将资料(例如图片)内嵌在网页之中，不用放到外部文件。
        imgReader.readAsDataURL(imgFile);
    }
}
//读取文件 onload事件
imgReader.onload = function (evt) {
    console.log(evt);
    //将该URL绑定到img标签的src属性上，就可以实现图片的上传预览效果了。
    $("#UsImgStudentPicture").attr("src", evt.target.result);
};

效果图：

图片已经可以选择了，现在需要将它保存到数据库

控制器代码：

MultipartFile为org.springframework.web.mutipart包下的一个类，如果想在项目中使用MultipartFile这个类，那么项目必须要使用spring框架才可以。
getBytes方法用来将文件转换成一种字节数组的方式进行传输
getSize方法用来获取文件的大小，单位是字节

@ResponseBody
@RequestMapping("InsertStudent")
public void InsertStudent(MultipartFile fileStudentImage) throws IOException {
    if(fileStudentImage != null){ 
        System.out.println(fileStudentImage); 
        BASE64Encoder base64Encoder =new BASE64Encoder();//base64
        //将该字符串保存到数据库即可
        String baseimg = "data:" + fileStudentImage.getContentType()+";base64," + base64Encoder.encode(fileStudentImage.getBytes());
    }
}

为什么需要保存该字符串？如图所示：

控制器输出：

如果报上传文件过大的错

是用配置bean就加上这个：

<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
	<property name="maxUploadSize">
	    <value>100000000</value> <!-- 以字节byte为单位  表示总共上传大小-->
	</property>
	<property name="defaultEncoding">
	     <value>UTF-8</value>
	</property>
</bean>

是用springboot的话就在配置文件加上：

spring.servlet.multipart.max-file-size = 10MB  
spring.servlet.multipart.max-request-size=10MB

对了,Mysql表储存图片字段的类型为mediumtext（text：最多65535个字符 65KB；mediumtext：16777215字节 16MB；longtext：4294967295字节4GB）

图片已经保存了，要回填的话就查出图片的数据放到img标签的src就行了

$("#UsImgStudentPicture").attr("src", data.photograph);

有可能有些项目回填图片时会报请求头太大的错

用tomcat启动的话就去apache-tomcat-9.0.27\conf\ server.xml里修改:

用springboot的话：