[JavaScript知识库] Vue 图片下载

开发: C++知识库 Java知识库 JavaScript Python PHP知识库人工智能区块链大数据移动开发嵌入式开发工具数据结构与算法开发测试游戏开发网络协议系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑笔记本显卡显示器固态硬盘硬盘耳机手机 iphone vivo oppo 小米华为单反装机图拉丁

-> JavaScript知识库 -> Vue 图片下载 -> 正文阅读

[JavaScript知识库]Vue 图片下载

图片流是jiif格式的，直接用a标签会强制打开。

   
      var image = new Image();
      image.src =url+"?t=" + new Date().getTime();//图片流
      image.crossOrigin = "*"; // 支持跨域图片
      image.onload = function () {
        var canvas = document.createElement("canvas");
        canvas.width = image.width;
        canvas.height = image.height;
        var ctx = canvas.getContext("2d");
        ctx.drawImage(image, 0, 0, image.width, image.height);
        var base64 = canvas.toDataURL("image/png");
        var elink = document.createElement("a");
        elink.style.display = "none";
        elink.download = "";
        elink.href = base64;
        document.body.appendChild(elink);
        elink.click();
        URL.revokeObjectURL(elink.href);
        document.body.removeChild(elink);
      };