1 运输介质
主要是通过字符串进行运输,也就是将一张图像编码成字符串,然后将字符串进行传输,服务器后端接收到字符串,进行解码,然后保存为png文件就行。
1.1 前端进行图像编码,将png图像转成字符串
function getBase64Image(img) {
var canvas = document.createElement("canvas");
canvas.width = img.width;
canvas.height = img.height;
var ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0, img.width, img.height);
var dataURL = canvas.toDataURL("image/png");
// return dataURL
return dataURL.replace("data:image/png;base64,", "");
}
1.2 前端通过jquery进行post请求
1.3 后端将字符串数据进行接收和解码以及存储图像
@PostMapping("/uploadImgDemo")
public void uploadImgDemo(String key) throws IOException {
System.out.println(key);
BASE64Decoder decoder = new BASE64Decoder();
byte[] b = decoder.decodeBuffer(key);
for (int i =0;i<b.length;i++){
if(b[i]<0){
b[i]+= 256;
}
}
FileOutputStream os = new FileOutputStream(FolderTool.getImageCollectorPath()+UUID.randomUUID().toString()+".png");
os.write(b);
os.flush();
os.close();
}