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

},

相关推荐
OpenTiny社区几秒前
电商系统集成GenUI SDK实操指南
前端·开源·ai编程
A_nanda2 分钟前
vue实现后端传输逐帧图像数据
前端·javascript·vue.js
YGY顾n凡4 分钟前
我开源了一个项目:一句话创造一个AI世界!
前端·后端·aigc
yyk的萌4 分钟前
Claude Code 命令大全
linux·运维·服务器·ai·claude code
qq_12084093717 分钟前
Three.js 工程向:动画循环与时间步进稳定性实践
前端·javascript
Fanfanaas8 分钟前
Linux 系统编程 进程篇(五)
linux·服务器·c语言·网络·学习·进程
SamDeepThinking9 分钟前
写了十几年代码,聊聊什么样的人能做好Java开发
java·后端·程序员
凛_Lin~~11 分钟前
安卓实现textview跑马灯效果
android·java
开源盛世!!19 分钟前
4.20-4.22
java·服务器·开发语言
旷世奇才李先生25 分钟前
React18\+TypeScript实战: Hooks封装与企业级组件开发
前端·javascript·typescript