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

},

相关推荐
12.=0.1 小时前
【REVIEW_C】【持续更新】
服务器·前端·javascript
Vuji1 小时前
Pi 插件解剖|todo.ts:297 行,拼出工具+命令+状态的完整插件
前端·agent
何以解忧,唯有..1 小时前
SpringBoot 中 @Transactional 注解失效的 8 种常见场景与解决方案
java
明月_清风1 小时前
开发者写PPT自救指南:4类对接场景,把技术讲清楚
前端·后端·面试
探索前端1 小时前
3dtiles加载时被地形遮挡问题研究及处理思路
前端·3d·cesium
SL-staff1 小时前
AB测试数据失真根因与变量热替换实战:JVS-Rules函数计算器架构解析
java·运维·微服务·函数式编程·规则引擎·变量管理·营销技术
Irene19911 小时前
Java 3 天入门:“最小必要知识”的功利性学法
java
Htr_1 小时前
Vercel 使用指南:框架、工作流与基础设施一体化的现代 Web 部署平台
前端
皮皮虾❀1 小时前
广州云服务器价格:阿里云代理商折扣报价单指南
运维·服务器·阿里云
长谷深风1111 小时前
Agent 何时该 Replan:五个关键判断
java·大数据·开发语言·ai agent·ai智能体·agent设计·clarify机制