上传照片预览显示并下载到项目目录

上传照片 预览

<tr>
    <td>个人头像：</td>
    <td>
        <input type="hidden" id="picname" name="picname"/>
        <input type="hidden" id="picsrc" name="picsrc"/>
        <img src="/static/image/默认.png" alt="选择并上传头像" id="user_pic"
        style="width: 140px;height: 140px;left:0;top: 0;"/><br>
        <input type="file" id="user_fpic" accept="image/png,image/gif,image/jpg"/>
    </td>
 </tr>
<script>
    // 头像预览
    $("#user_fpic").change(function () {
        // 获取上传文件对象
        var file = $(this)[0].files[0];
        //传递 图片名称
        $("#picname").val(file.name)
        // 读取文件URL
        var reader = new FileReader();
        //FileReader对象的readAsDataURL方法可以将读取到的文件编码成Data URL。
        //Data URL是一项特殊的技术，可以将资料(例如图片)内嵌在网页之中，不用放到外部文件。
        //使用Data URL的好处是，您不需要额外再发出一个HTTP 请求到服务器端取得额外的资料；
        //而缺点便是，网页的大小可能会变大。它适合应用在内嵌小图片，不建议将大图像文件编码成Data URL来使用。
        //您的图像文件不能够超过浏览器限定的大小，否则无法读取图像文件。
        reader.readAsDataURL(file);
        // 阅读文件完成后触发的事件 执行回调函数
        //将图片base64编码赋值给<img>标签 在hidden域保存编码
        reader.onload = function () {
            alert(this.result)
            // 读取的URL结果：this.result
            $("#picsrc").val(this.result)
            $("#user_pic").attr("src", this.result);
        }
    });
</script>

下载图片到项目目录

import java.util.Base64;
import java.util.UUID;

String picsrc=new String(request.getParameter("picsrc").getBytes("ISO-8859-1"),"UTF-8");
String picname=new String(request.getParameter("picname").getBytes("ISO-8859-1"),"UTF-8");
//清空编码前缀
picsrc = picsrc.replace("data:image/png;base64,", "");
picsrc = picsrc.replace("data:image/jpeg;base64,", "");
File file = null;
//创建文件目录
//String filePath="D:\\image";
String filePath="文件路径";
File  dir=new File(filePath);

//为每个图片生成全局唯一标识
UUID uuid = UUID.randomUUID();

if (!dir.exists() && !dir.isDirectory()) {
    dir.mkdirs();
}
BufferedOutputStream bos = null;
java.io.FileOutputStream fos = null;
try {
    //base64解码解码
    byte[] bytes = Base64.getDecoder().decode(picsrc);
    //完整路径
    file=new File(filePath+"\\"+uuid+picname);
    fos = new java.io.FileOutputStream(file);
    bos = new BufferedOutputStream(fos);
    bos.write(bytes);
} catch (Exception e) {
    e.printStackTrace();
    System.out.println(e);
} finally {
    if (bos != null) {
        try {
            bos.close();
        } catch (IOException e) {
            e.printStackTrace();
        }
    }
    if (fos != null) {
        try {
            fos.close();
        } catch (IOException e) {
            e.printStackTrace();
        }
    }
}