javascript - 在javascript中将二进制形式转换为base64字符串

Question

<分区>

Answer 1

如果您从服务器检索该图像，您可以选择从服务器转换为 base64(并准备好提供给客户端)，或者您需要从服务器传递图像的 URL，然后读取它并从客户端 javascript 转换为 base64。但是，如果您从服务器检索该二进制文件到客户端，客户端将无法解析它，因为数据由于错误的发送方法而损坏。

将 URL 转换为 base64 的示例(使用 Canvas 或 FileReader):

function convertImgToDataURLviaCanvas(url){
    var img = new Image();
    img.crossOrigin = 'Anonymous';
    img.onload = function(){
        var canvas = document.createElement('CANVAS');
        var ctx = canvas.getContext('2d');
        var dataURL;
        canvas.height = this.height;
        canvas.width = this.width;
        ctx.drawImage(this, 0, 0);
        dataURL = canvas.toDataURL("image/png");
        canvas = null; 
    };
    img.src = url;
}

function convertFileToDataURLviaFileReader(url){
    var xhr = new XMLHttpRequest();
    xhr.responseType = 'blob';
    xhr.onload = function() {
        var reader  = new FileReader();
        reader.onloadend = function () {
            console.log(reader.result);
        }
        reader.readAsDataURL(xhr.response);
    };
    xhr.open('GET', url);
    xhr.send();
}

转换 fiddle :

http://jsfiddle.net/handtrix/yvq5y/