vue 图片url转Base64编码

最新推荐文章于 2025-03-31 18:28:58 发布

༺༽༾ཊ方觉ཏ༿༼༻

最新推荐文章于 2025-03-31 18:28:58 发布

阅读量676

点赞数 2

文章标签： vue.js javascript 前端

本文链接：https://blog.youkuaiyun.com/qq_45555960/article/details/137146878

版权

本文介绍了如何使用JavaScript中的Image对象和CanvasAPI将图片URL转换为Base64编码，并在加载完成后通过回调函数返回数据。方法涉及创建Image对象、设置随机查询参数、处理跨域和利用Canvas进行图像绘制。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

getBase64(url, callback) {
      var Img = new Image(),
        dataURL = "";
      Img.src = url + "?v=" + Math.random();
      Img.setAttribute("crossOrigin", "Anonymous");
      Img.onload = function () {
        var canvas = document.createElement("canvas"),
          width = Img.width,
          height = Img.height;
        canvas.width = width;
        canvas.height = height;
        canvas.getContext("2d").drawImage(Img, 0, 0, width, height);
        dataURL = canvas.toDataURL("image/jpeg");
        callback ? callback(dataURL) : null;
      };
    }