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 小时前
Java 手机号校验工具类
java
小研说技术2 小时前
实时通信对比,一场MCP协议的技术革命
前端·后端·面试
小此方2 小时前
Re:Linux系统篇(五)指令篇 ·四:shell外壳程序及其工作原理
linux·运维·服务器
凤山老林2 小时前
26-Java this 关键字
java·开发语言
kyriewen2 小时前
React Hooks原理:为什么不能写在if里?揭开Hook的“魔法”面纱
前端·react.js·前端框架
敲代码的彭于晏2 小时前
Claude Code Token 烧得太快?这8个方案帮你立省90%!
前端·ai编程·claude
可视之道2 小时前
设备拓扑图中的实时状态映射与动画策略:告警闪烁、流向动画、质量码怎么共存
前端
涂兵兵_青石疏影2 小时前
绘制图像-clip方法
前端
其实防守也摸鱼2 小时前
sqlmap下载和安装保姆级教程(附安装包)
linux·运维·服务器·测试工具·渗透测试·攻防·护网行动
焦糖玛奇朵婷2 小时前
解锁扭蛋机小程序的五大优势
java·大数据·服务器·前端·小程序