- 通过url获取图片base64,在线代码
function imgToBase64(url,callback){
const img=new Image();
let imageType="image/png"
img.src= url;
img.crossOrigin="Anonymous";
img.onload=function(){
const canvas = document.createElement("canvas");
const ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0);
const dataURL = canvas.toDataURL(imageType);
callback(dataURL);
}
}
- base64转化为blob
dataURLtoBlob(dataurl: string) {
const arr = dataurl.split(',')
const mime = arr[0].match(/:(.*?);/)[1]
const bstr = atob(arr[1])
let n = bstr.length
const u8arr = new Uint8Array(n);
while (n--) {
u8arr[n] = bstr.charCodeAt(n);
}
return new Blob([u8arr], {
type: mime
});
}
- 转换为文件
dataURLtoFile(dataurl: string, filename: string) {
const arr = dataurl.split(',');
const mime = arr[0].match(/:(.*?);/)[1];
const bstr = atob(arr[1]);
let n = bstr.length;
const u8arr = new Uint8Array(n);
while (n--) {
u8arr[n] = bstr.charCodeAt(n);
}
return new File([u8arr], filename, { type: mime });
}
- 下载blob
downloadBlob(blob: any, fileName: string) {
const a = document.createElement("a");
a.href = URL.createObjectURL(blob);
a.download = fileName;
a.click();
URL.revokeObjectURL(a.href);
a.remove();
}
- file转化为base64
fileToBase64(file: UploadFile, success: (base64: string, e: any) => void) {
const reader = new FileReader()
reader.readAsDataURL(file as any)
reader.onloadend = (e: any) => {
const base64 = e.target.result
success(base64, e)
}
}
- 通过url下载图片,在线代码
function downloadImg(url, name) {
fetch(url,{mode: 'cors', })
.then(function (response) {
return response.blob();
})
.then(function (response) {
const a = document.createElement("a");
a.style.display = "none";
a.href = URL.createObjectURL(response);
a.download = name;
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
});
}