Base64 encoding and decoding in client-side Javascript

前端 未结 14 2061
挽巷
挽巷 2020-11-22 04:27

Are there any methods in JavaScript that could be used to encode and decode a string using base64 encoding?

相关标签:
14条回答
  • 2020-11-22 05:18

    In Gecko/WebKit-based browsers (Firefox, Chrome and Safari) and Opera, you can use btoa() and atob().

    Original answer: How can you encode a string to Base64 in JavaScript?

    0 讨论(0)
  • 2020-11-22 05:19

    For JavaScripts frameworks where there is no atob method and in case you do not want to import external libraries, this is short function that does it.

    It would get a string that contains Base64 encoded value and will return a decoded array of bytes (where the array of bytes is represented as array of numbers where each number is an integer between 0 and 255 inclusive).

    function fromBase64String(str) {
        var alpha = 
        "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
        var value = [];
        var index = 0;
        var destIndex  = 0;
        var padding = false;
        while (true) {
    
            var first  = getNextChr(str, index, padding, alpha);
            var second = getNextChr(str, first .nextIndex, first .padding, alpha);
            var third  = getNextChr(str, second.nextIndex, second.padding, alpha);
            var fourth = getNextChr(str, third .nextIndex, third .padding, alpha);
    
            index = fourth.nextIndex;
            padding = fourth.padding;
    
            // ffffffss sssstttt ttffffff
            var base64_first  = first.code  == null ? 0 : first.code;
            var base64_second = second.code == null ? 0 : second.code;
            var base64_third  = third.code  == null ? 0 : third.code;
            var base64_fourth = fourth.code == null ? 0 : fourth.code;
    
            var a = (( base64_first << 2) & 0xFC ) | ((base64_second>>4) & 0x03);
            var b = (( base64_second<< 4) & 0xF0 ) | ((base64_third >>2) & 0x0F);
            var c = (( base64_third << 6) & 0xC0 ) | ((base64_fourth>>0) & 0x3F);
    
            value [destIndex++] = a;
            if (!third.padding) {
                value [destIndex++] = b;
            } else {
                break;
            }
            if (!fourth.padding) {
                value [destIndex++] = c;
            } else {
                break;
            }
            if (index >= str.length) {
                break;
            }
        }
        return value;
    }
    
    function getNextChr(str, index, equalSignReceived, alpha) {
        var chr = null;
        var code = 0;
        var padding = equalSignReceived;
        while (index < str.length) {
            chr = str.charAt(index);
            if (chr == " " || chr == "\r" || chr == "\n" || chr == "\t") {
                index++;
                continue;
            }
            if (chr == "=") {
                padding = true;
            } else {
                if (equalSignReceived) {
                    throw new Error("Invalid Base64 Endcoding character \"" 
                        + chr + "\" with code " + str.charCodeAt(index) 
                        + " on position " + index 
                        + " received afer an equal sign (=) padding "
                        + "character has already been received. "
                        + "The equal sign padding character is the only "
                        + "possible padding character at the end.");
                }
                code = alpha.indexOf(chr);
                if (code == -1) {
                    throw new Error("Invalid Base64 Encoding character \"" 
                        + chr + "\" with code " + str.charCodeAt(index) 
                        + " on position " + index + ".");
                }
            }
            break;
        }
        return { character: chr, code: code, padding: padding, nextIndex: ++index};
    }
    

    Resources used: RFC-4648 Section 4

    0 讨论(0)
提交回复
热议问题