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);

},

相关推荐
南_山无梅落6 分钟前
9.Python3集合(set)增删改查和推导式
java·开发语言
JustHappy17 分钟前
「chrome extensions🛠️」我写了一个超级简单的浏览器插件Vue开发模板
前端·javascript·github
Loo国昌18 分钟前
Vue 3 前端工程化:架构、核心原理与生产实践
前端·vue.js·架构
sg_knight21 分钟前
拥抱未来:ECMAScript Modules (ESM) 深度解析
开发语言·前端·javascript·vue·ecmascript·web·esm
LYFlied22 分钟前
【每日算法】LeetCode 17. 电话号码的字母组合
前端·算法·leetcode·面试·职场和发展
开发者小天22 分钟前
react中useEffect的用法,以及订阅模式的原理
前端·react.js·前端框架
爱笑的眼睛1122 分钟前
超越MSE与交叉熵:深度解析损失函数的动态本质与高阶设计
java·人工智能·python·ai
alengan23 分钟前
linux上面写python3日志服务器
linux·运维·服务器
前端白袍42 分钟前
Vue:如何实现一个具有复制功能的文字按钮?
前端·javascript·vue.js