js 将图片连接转换称base64格式

wyyfwm

于 2015-05-22 15:02:23 发布

阅读量1.9w

点赞数 2

分类专栏： js

js 专栏收录该内容

44 篇文章

订阅专栏

本文介绍了一种将图片转换为Base64格式的方法，这种方法可以减少HTTP请求次数，但浏览器不会缓存这些图像。文章提供了一个JavaScript函数，用于将指定URL的图像转换为Base64格式。

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

我们把图像文件的内容直接写在了HTML 文件中，这样做的好处是，节省了一个HTTP 请求。坏处呢，就是浏览器不会缓存这种图像。现在我们提供一个js：

function 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/png');
        callback.call(this, dataURL);
        canvas = null; 
    };
    img.src = url;
}


convertImgToBase64('http://bit.ly/18g0VNp', function(base64Img){
    // Base64DataURL
});