大型文件，一般直接存在本地，不用数据库

@RestController
public class TestController {
 
    @PostMapping("/imageJson")
    public Map getImageJson() throws IOException {
        FileInputStream fileInputStream = new FileInputStream("E:/test/1.jpg");
        ByteArrayOutputStream bos = new ByteArrayOutputStream();
        byte[] b = new byte[1024];
        int len = -1;
        while((len = fileInputStream.read(b)) != -1) {
            bos.write(b, 0, len);
        }
        byte[] fileByte = bos.toByteArray();
        //以上为读取图片变成字节数组
        HashMap<String, Object> map = new HashMap<>(2);
        map.put("data",new person("张三","18"));
        //进行base64位加密
        BASE64Encoder encoder = new BASE64Encoder();
        String data = encoder.encode(fileByte);
        map.put("image",data);
        return map;
    }
}

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>测试验证码2</title>
</head>
<body>
<div>
    <img id="kaptchaImage" onclick="change();"/>
</div>
<div>
    <button id="changeImage" style="width: 12.5rem;height: 12.5rem;">刷新图片</button>
</div>
<div>
    <textarea id="showByte" cols="60" rows="15" style="font-size: 1.125rem;" placeholder="显示收到的字节数组"></textarea>
</div>
<div id="imgcontainer"></div>
 
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
<script>
    $("#changeImage").click(function () {
        $.ajax({
            type: "POST",
            async: false,
            url: "http://127.0.0.1:8080/imageJson",
            dataType: "json",
            success: function (result) {
                console.log(result);
                var data = result.data;
                var image = result.image;
                $("#kaptchaImage").attr("src", "data:image/png;base64," + image);
                $("#showByte").text(image);
 
            }
        })
    })
</script>
</body>
</html>