js前端 base64图片下载保存

柔情只为你懂 2022-10-03 01:52 543阅读 0赞

watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3BrNjk0MDQ2MjIw_size_16_color_FFFFFF_t_70

如图，我想通过点击“保存按钮”，将这张base64图片保存到本地。

  1. // 保存按钮点击事件方法
  2. function saveImg(){
  3.             var sampleImage = $("img")[0]; // 找到图片所在的img标签
  4.             var canvas = convertImageToCanvas(sampleImage); //创建画板
  5.             url = canvas.toDataURL("image/png"); //生成下载的url
  6.             var triggerDownload = $("#saveImg").attr("href", url).attr("download", "ewm.png"); // 把url放到我们的a标签中，并得到a标签对象
  7.             triggerDownload[0].click(); //模拟点击一下a标签，即可下载啦！
  8.     }
  10.     /**
  11.      * 根据图片生成画布
  12.      */
  13.     function convertImageToCanvas(image) {
  14.         var canvas = document.createElement("canvas");
  15.         canvas.width = image.width;
  16.         canvas.height = image.height;
  17.         canvas.getContext("2d").drawImage(image, 0, 0);
  18.         return canvas;
  19.     }

watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3BrNjk0MDQ2MjIw_size_16_color_FFFFFF_t_70 1

发表评论

表情：
评论列表 （有 0 条评论，543人围观）

还没有评论，来说两句吧...

相关阅读