vue前端根据接口返回的url 下载图片

downloadPicture(imgSrc, name) {

const image = new Image();

// 解决跨域 Canvas 污染问题

image.setAttribute("crossOrigin", "anonymous");

image.src = imgSrc;

image.onload = () => {

const canvas = document.createElement("canvas");

canvas.width = image.width;

canvas.height = image.height;

const context = canvas.getContext("2d");

context.drawImage(image, 0, 0, image.width, image.height);

canvas.toBlob((blob) => {

const url = URL.createObjectURL(blob);

const a = document.createElement("a");

a.download = name || "photo";

a.href = url;

a.click();

a.remove();

URL.revokeObjectURL(url);

});

};

},

downLineFlow(row) {

this.downloadPicture(row.signatureUrl, row.username);

},

相关推荐
呉師傅几秒前
关于惠普LaserJet1018打印机在Windows11上打印颜色偏淡的问题解决方法
运维·服务器·windows·计算机外设·电脑
BigTopOne2 分钟前
ArLiveLite-具体功能
前端
BigTopOne6 分钟前
ArLiveLite -具体功能
前端
Sherotree8 分钟前
理解 JWT:三段分别是什么
前端·ai·开源
BigTopOne8 分钟前
ArLiveLite 用到的 FFmpeg API
前端
楠楠子呀14 分钟前
独立站聊天转化全链路:从二维码引流到数据复盘
java·javascript·数据仓库·python·c#·自动化·etl
BigTopOne14 分钟前
ArLiveLite -功能架构详解
前端
yurenpai(27届找实习中)15 分钟前
从零读懂AI智能客服(二):Java 多模块项目如何协作:Maven 依赖、Spring 注入与运行时装配
java·spring·maven
winfredzhang17 分钟前
一个 HTML 文件的备忘录:纸间备忘(Memo on Paper)源码全解析
前端·html·导出·localstorage·备忘录·json和html
智商偏低20 分钟前
bindFramebuffer
前端·javascript·html