前端上传图片回显并用base64编码，后端做解码储存，存储图片路径在.properties文件中配置（以上传身份证照片为例）

前端页面：
<form id="kycForm" enctype="multipart/form-data">

<input type="hidden" id="hid" name="idPhotoUrl" value=""/>
<input type="hidden" id="hid2" name="idPhotoUrl2" value=""/>

<div class="first-key">

    <div> <img src="背景图片路径" alt="" style="width: 100%;height: 100%;margin-top:.3rem;"></div>
    <img id="img1" class="img" src="上传按钮样式图片路径" alt=" " >
    <input type="file" class="file"  placeholder="ICCID" id="fil" name="photo1"  accept="img/*" capture="camera">
    <span style="margin-top: .5rem;z-index: 99">上传身份证正面照</span>

</div>
<div class="first-key">
    <div> <img src="背景图片路径" alt="" style="margin-top: .3rem;width: 100%;height: 100%;"></div>
    <img id="img2" class="img" src="上传按钮样式图片路径" alt="">
    <input type="file" class="file"  placeholder="ICCID" id="fil2" name="photo2" accept="img/*" capture="camera">
    <span style="margin-top: .5rem">手持身份证反面照</span>
</div>

<div class="btn-center">
    <button type="button" id="btn-go" class="btn btn-primary"  >提交审核</button>
</div>
</form>

<script>
    $(".first-key").on("change", "input[name=photo1]", function() {
        $(this).prev().css("opacity","1")
        var filePath = $(this).val();//读取图片路径
        //将图片的URL赋值与hidden标签内
        var fr = new FileReader();//创建new FileReader()对象
        var imgObj = this.files[0];//获取图片
        fr.readAsDataURL(imgObj);//将图片读取为DataURL
        var obj = $(this).prev()[0];//
        var arr = filePath.split('\\');
        var fileName = arr[arr.length - 1];
        $("#img1").removeClass("img");
        $("#img1").addClass("img2");
        $(this).parent().next().show();
        fr.onload = function() {
            obj.src = this.result;
            //将base64编码后的图片赋值到hidden标签内
            $("#hid").val(obj.src);
        };
    });
    $(".first-key").on("change", "input[name=photo2]", function() {
        $(this).prev().css("opacity","1")
        var filePath = $(this).val();//读取图片路径
        //将图片的URL赋值与hidden标签内
        var fr = new FileReader();//创建new FileReader()对象
        var imgObj = this.files[0];//获取图片
        fr.readAsDataURL(imgObj);//将图片读取为DataURL
        var obj = $(this).prev()[0];//
        var arr = filePath.split('\\');
        var fileName = arr[arr.length - 1];
        $("#img2").removeClass("img");
        $("#img2").addClass("img2");
        $(this).parent().next().show();
        fr.onload = function() {
            obj.src = this.result;
            //将base64编码后的图片赋值到hidden标签内
            $("#hid2").val(obj.src);
        };
    });
    console.log($("#hid2").val());
</script>

后端代码：

//对字节数组字符串进行Base64解码并生成图片
if (idPhotoUrl == null || idPhotoUrl2 == null) { //图像数据为空
    success(false);
}
 BASE64Decoder decoder = new BASE64Decoder();
byte[] b =new byte[0] ;
if(idPhotoUrl.contains("data:image/png;base64")){
    //Base64解码
    b=decoder.decodeBuffer(idPhotoUrl.replace("data:image/png;base64,", ""));
}
if(idPhotoUrl.contains("data:image/jpeg;base64")){
    //Base64解码
    b=decoder.decodeBuffer(idPhotoUrl.replace("data:image/jpeg;base64,", ""));
}
//idPhotoUrl = idPhotoUrl.replace("data:image/jpeg;base64,", "");
for (int i = 0; i < b.length; ++i) {
    if (b[i] < 0) {//调整异常数据
        b[i] += 256;
    }
}
//生成jpg图片
Properties prop = new Properties();
InputStream ins = this.getClass().getResourceAsStream("/config/photoUrl.properties");
prop.load(ins);
String imgFilePath = prop.getProperty("PHOTOURL") + UUID.randomUUID() + ".jpg";//新生成的图片
OutputStream out = new FileOutputStream(imgFilePath);
out.write(b);
out.flush();
out.close();
user.setIdPhotoUrl(imgFilePath);

byte[] b2 =new byte[0] ;
if(idPhotoUrl2.contains("data:image/png;base64")){
    //Base64解码
    b2=decoder.decodeBuffer(idPhotoUrl2.replace("data:image/png;base64,", ""));
}
if(idPhotoUrl2.contains("data:image/jpeg;base64")){
    //Base64解码
    b2=decoder.decodeBuffer(idPhotoUrl2.replace("data:image/jpeg;base64,", ""));
}
//idPhotoUrl = idPhotoUrl.replace("data:image/jpeg;base64,", "");
for (int i = 0; i < b2.length; ++i) {
    if (b2[i] < 0) {//调整异常数据
        b2[i] += 256;
    }
}
//生成jpg图片
String imgFilePath2 = prop.getProperty("PHOTOURL") + UUID.randomUUID() + ".jpg";//新生成的图片
OutputStream out2 = new FileOutputStream(imgFilePath2);
out2.write(b2);
out2.flush();
out2.close();

user.setIdPhotoUrl2(imgFilePath2);

properties文件：

     PHOTOURL=想放的文件夹绝对路径