JS图片url地址转base64图片编码

发狂精灵

已于 2024-04-23 13:37:21 修改

阅读量1.9k

点赞数 8

CC 4.0 BY-SA版权

分类专栏： JS 文章标签： javascript vue.js

于 2023-12-29 10:28:01 首次发布

本文链接：https://blog.youkuaiyun.com/fakuangjingling/article/details/135285196

JS 专栏收录该内容

6 篇文章

订阅专栏

该文章详细描述了一个函数，如何利用HTML5CanvasAPI将网络图片转换成Base64格式，以便于在JavaScript中进行数据传输或存储。

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

convertImgToBase64(url, callback, outputFormat){
    var canvas = document.createElement('CANVAS'),
　　ctx = canvas.getContext('2d'),
　　img = new Image;
　　img.crossOrigin = 'Anonymous';
　　img.onload = function(){
    　　canvas.height = img.height;
    　　canvas.width = img.width;
    　　ctx.drawImage(img,0,0);
    　　var dataURL = canvas.toDataURL(outputFormat || 'image/jpg');
    　　callback.call(this, dataURL);
    　　canvas = null; 
    };
　　img.src = url;
} 
//参考链接
let url = "https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png"
convertImgToBase64(url,(base64Img)=>{
	alert(base64Img)//转化后的base64文件
})