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

},

相关推荐
测试界的海飞丝2 小时前
10道软件测试面试题及其答案:
服务器·测试工具·职场和发展
skywalk81632 小时前
linux安装Code Server 以便Comate IDE和CodeBuddy等都可以远程连上来
linux·运维·服务器·vscode·comate
J***Q2922 小时前
Vue数据可视化
前端·vue.js·信息可视化
S***26752 小时前
基于SpringBoot和Leaflet的行政区划地图掩膜效果实战
java·spring boot·后端
马剑威(威哥爱编程)3 小时前
鸿蒙6开发视频播放器的屏幕方向适配问题
java·音视频·harmonyos
@游子3 小时前
内网渗透笔记-Day5
运维·服务器
JIngJaneIL3 小时前
社区互助|社区交易|基于springboot+vue的社区互助交易系统(源码+数据库+文档)
java·数据库·vue.js·spring boot·论文·毕设·社区互助
Yawesh_best3 小时前
告别系统壁垒!WSL+cpolar 让跨平台开发效率翻倍
运维·服务器·数据库·笔记·web安全
V***u4533 小时前
MS SQL Server partition by 函数实战二 编排考场人员
java·服务器·开发语言
ttod_qzstudio4 小时前
深入理解 Vue 3 的 h 函数:构建动态 UI 的利器
前端·vue.js