我有一个PHP脚本,可以将PNG图像编码为Base64字符串。

我想用JavaScript做同样的事情。我知道如何打开文件,但我不知道如何进行编码。我不习惯使用二进制数据。


当前回答

这个问题和它的答案为我指明了正确的方向。 特别是Unicode, atob和btoa不能“香草”使用,这些天所有的东西都是Unicode…

直接来自Mozilla的两个很好的函数。 使用Unicode和HTML标签进行测试:

function b64EncodeUnicode(str) {
    return btoa(encodeURIComponent(str).replace(/%([0-9A-F]{2})/g, function(match, p1) {
        return String.fromCharCode('0x' + p1);
    }));
}

b64EncodeUnicode('✓ à la mode'); // "4pyTIMOgIGxhIG1vZGU="
b64EncodeUnicode('\n'); // "Cg=="


function b64DecodeUnicode(str) {
    return decodeURIComponent(Array.prototype.map.call(atob(str), function(c) {
        return '%' + ('00' + c.charCodeAt(0).toString(16)).slice(-2);
    }).join(''));
}

b64DecodeUnicode('4pyTIMOgIGxhIG1vZGU='); // "✓ à la mode"
b64DecodeUnicode('Cg=='); // "\n"

与使用自定义JavaScript函数的原始Base64解码相比,这些函数将以闪电般的速度执行,因为btoa和atob在解释器外部执行。

如果你可以忽略旧的ie浏览器和旧的手机(比如iPhone 3?),这应该是一个很好的解决方案。

其他回答

您可以使用btoa(从Base64)和atob(从Base64)。

对于ie9及以下版本,请尝试jquery-base64插件:

$.base64.encode("this is a test");
$.base64.decode("dGhpcyBpcyBhIHRlc3Q=");

在_utf8_decode的两个实现中都有一些错误。C1和c2由于var语句的错误使用被赋值为全局变量,c3根本没有初始化或声明。

它可以工作,但这些变量将覆盖该函数之外的任何具有相同名称的现有变量。

这里有一个版本不会这样做:

// private method for UTF-8 decoding
_utf8_decode : function (utftext) {
    var string = "";
    var i = 0;
    var c = 0, c1 = 0, c2 = 0;

    while ( i < utftext.length ) {

        c = utftext.charCodeAt(i);

        if (c < 128) {
            string += String.fromCharCode(c);
            i++;
        }
        else if((c > 191) && (c < 224)) {
            c1 = utftext.charCodeAt(i+1);
            string += String.fromCharCode(((c & 31) << 6) | (c1 & 63));
            i += 2;
        }
        else {
            c1 = utftext.charCodeAt(i+1);
            c2 = utftext.charCodeAt(i+2);
            string += String.fromCharCode(((c & 15) << 12) | ((c1 & 63) << 6) | (c2 & 63));
            i += 3;
        }
    }
    return string;
}

对于更新的浏览器编码Uint8Array到字符串,并解码字符串到Uint8Array。

const base64 = {
    decode: s => Uint8Array.from(atob(s), c => c.charCodeAt(0)),
    encode: b => btoa(String.fromCharCode(...new Uint8Array(b)))
};

对于Node.js,你可以使用以下代码将string、Buffer或Uint8Array编码为string,并从string、Buffer或Uint8Array解码为Buffer。

const base64 = {
    decode: s => Buffer.from(s, 'base64'),
    encode: b => Buffer.from(b).toString('base64')
};

您可以在浏览器中使用btoa()/atob(),但需要一些改进,如https://base64tool.com/uncaught-domexception-btoa-on-window/和https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/btoa所述的UTF字符串支持!

这是一个helper funktion来编码到base64url:

base64url (s) {
        var to64url = btao(s);
         // Replace non-url compatible chars with base64url standard chars and remove leading =
        return to64url.replace(/\+/g, '_').replace(/\//g, '-').replace(/=+$/g, '');
    }