客户端 Javascript 中的 Base64 编码和解码

IT技术 javascript base64
2021-01-27 18:18:39

JavaScript 中是否有任何方法可用于使用 base64 编码对字符串进行编码和解码?

6个回答

一些浏览器,如 Firefox、Chrome、Safari、Opera 和 IE10+ 可以原生处理 Base64。看看这个Stackoverflow 问题它正在使用btoa()atob()功能

对于服务端 JavaScript(Node),可以使用Buffers 进行解码。

如果您要跨浏览器解决方案,可以使用现有的库,如CryptoJS或代码,如:

http://ntt.cc/2008/01/19/base64-encoder-decoder-with-javascript.html存档

对于后者,您需要彻底测试跨浏览器兼容性的功能。并且已经报告了错误

Node.js 可以在本地执行 Base64:(new Buffer('Hello, world!').toString('base64'); new Buffer('SGVsbG8sIHdvcmxkIQ==', 'base64').toString('ascii'); 来源)
2021-03-12 18:18:39
在节点 5+ 中,使用 Buffer.from,因为new Buffer(string)已弃用。Buffer.from(jwt.split('.')[1], 'base64').toString()
2021-03-29 18:18:39
我使用这种方法使用日期 URI 方案在 base64 中对 SVG 进行编码。惊喜:这个函数对每个字符进行 urlencode,所以我在目标处得到了这个格式错误的 XML:%3C%3Fxml%20version%3D%271.0%27%20%3F%3E%3Csvg%20xmlns%3D%27http%...
2021-04-02 18:18:39
如果我想做 URL 安全的?
2021-04-05 18:18:39

Internet Explorer 10+

// Define the string
var string = 'Hello World!';

// Encode the String
var encodedString = btoa(string);
console.log(encodedString); // Outputs: "SGVsbG8gV29ybGQh"

// Decode the String
var decodedString = atob(encodedString);
console.log(decodedString); // Outputs: "Hello World!"

跨浏览器

为 AMD、CommonJS、Nodejs 和浏览器重写和module化 UTF-8 和 Base64 Javascript 编码和解码库/module。跨浏览器兼容。


使用 Node.js

以下是在 Node.js 中将普通文本编码为 base64 的方法:

//Buffer() requires a number, array or string as the first parameter, and an optional encoding type as the second parameter. 
// Default is utf8, possible encoding types are ascii, utf8, ucs2, base64, binary, and hex
var b = new Buffer('JavaScript');
// If we don't use toString(), JavaScript assumes we want to convert the object to utf8.
// We can make it convert to other formats by passing the encoding type to toString().
var s = b.toString('base64');

以下是解码 base64 编码字符串的方法:

var b = new Buffer('SmF2YVNjcmlwdA==', 'base64')
var s = b.toString();

使用 Dojo.js

使用 dojox.encoding.base64 对字节数组进行编码:

var str = dojox.encoding.base64.encode(myByteArray);

要解码 base64 编码的字符串:

var bytes = dojox.encoding.base64.decode(str)

凉亭安装 angular-base64

<script src="bower_components/angular-base64/angular-base64.js"></script>

angular
    .module('myApp', ['base64'])
    .controller('myController', [

    '$base64', '$scope', 
    function($base64, $scope) {
    
        $scope.encoded = $base64.encode('a string');
        $scope.decoded = $base64.decode('YSBzdHJpbmc=');
}]);

但是如何?

如果你想了解更多关于 base64 是如何编码的,特别是在 JavaScript 中,我会推荐这篇文章: JavaScript 中的计算机科学:Base64 编码

我知道这是一个旧答案,但new Buffer()似乎已被弃用。对于像我这样的新观众,Buffer.from()应该达到与下面@ecoologic 的回应相同的结果
2021-03-22 18:18:39
使用节点的js我简化为:new Buffer('SmF2YVNjcmlwdA==', 'base64').toString()有什么特别的理由不这样做吗?
2021-03-26 18:18:39
仅供参考:跨浏览器版本有一些令人讨厌的泄漏,c2并且很可能c1c3因此它无法"use strict"按照上述定义工作
2021-04-03 18:18:39

在基于 Gecko/WebKit 的浏览器(Firefox、Chrome 和 Safari)和 Opera 中,您可以使用btoa()atob()

原始答案:如何在 JavaScript 中将字符串编码为 Base64?

这是一个救命稻草。我使用了几种不同的实现来解码非常大的 base64 编码字符串,结果总是错误的。atob() 效果很好!
2021-03-10 18:18:39
哇,谢谢你。不知道这些浏览器中有原生 base64 编码器!
2021-03-10 18:18:39
小吹毛求疵:Opera 不基于 Gecko 或 Webkit,它使用自己的渲染引擎 Presto。
2021-03-14 18:18:39
我意识到这是一篇旧帖子,但关于@b2238488 的担忧,您可以拆分 base64 字符串,使每个令牌的长度都是 4 的倍数,并分别对其进行解码。结果将与一次解码整个字符串相同。
2021-03-14 18:18:39
@PeterOlson 不再是 :)
2021-04-04 18:18:39

这是狙击手帖子的加强版。它假定格式良好的 base64 字符串没有回车。这个版本消除了几个循环,添加了&0xffYaroslav修复,消除了尾随空值,加上一些代码高尔夫。

decodeBase64 = function(s) {
    var e={},i,b=0,c,x,l=0,a,r='',w=String.fromCharCode,L=s.length;
    var A="ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
    for(i=0;i<64;i++){e[A.charAt(i)]=i;}
    for(x=0;x<L;x++){
        c=e[s.charAt(x)];b=(b<<6)+c;l+=6;
        while(l>=8){((a=(b>>>(l-=8))&0xff)||(x<(L-2)))&&(r+=w(a));}
    }
    return r;
};
甚至更少的字节;D decodeBase64=function(f){var g={},b=65,d=0,a,c=0,h,e="",k=String.fromCharCode,l=f.length;for(a="";91>b;)a+=k(b++);a+=a.toLowerCase()+"0123456789+/";for(b=0;64>b;b++)g[a.charAt(b)]=b;for(a=0;a<l;a++)for(b=g[f.charAt(a)],d=(d<<6)+b,c+=6;8<=c;)((h=d>>>(c-=8)&255)||a<l-2)&&(e+=k(h));return e};
2021-03-16 18:18:39
是的,但仅适用于 ASCII。例如,Cyr 字符被损坏。
2021-03-27 18:18:39
@MartinKovachev 您可以发布带有 Cyr 字符和相应 base64 编码的示例文本的新评论吗?也许我们可以修复代码以适应。
2021-03-30 18:18:39
@OliverSalzburg 甚至更少生成代码表:): var g={},k=String.fromCharCode,i;for(i=0;i<64;)g[k(i>61?(i&1)*4|43:i+[65,71,-4][i/26&3])]=i++;
2021-04-06 18:18:39
这里:类似的东西:тестова фраза
2021-04-09 18:18:39

没有故障安全的简短而快速的 Base64 JavaScript 解码函数:

function decode_base64 (s)
{
    var e = {}, i, k, v = [], r = '', w = String.fromCharCode;
    var n = [[65, 91], [97, 123], [48, 58], [43, 44], [47, 48]];

    for (z in n)
    {
        for (i = n[z][0]; i < n[z][1]; i++)
        {
            v.push(w(i));
        }
    }
    for (i = 0; i < 64; i++)
    {
        e[v[i]] = i;
    }

    for (i = 0; i < s.length; i+=72)
    {
        var b = 0, c, x, l = 0, o = s.substring(i, i+72);
        for (x = 0; x < o.length; x++)
        {
            c = e[o.charAt(x)];
            b = (b << 6) + c;
            l += 6;
            while (l >= 8)
            {
                r += w((b >>> (l -= 8)) % 256);
            }
         }
    }
    return r;
}
Tyk 虚拟端点 javascript 代码似乎在 '\x00' 部分有问题。用 r = r.replace(/\x00/g, '') 替换它使其工作
2021-03-27 18:18:39
Opera 11.62 似乎有“%256”部分的问题。用 '&0xff' 替换它就可以了。
2021-03-28 18:18:39