在客户端Javascript中进行Base64编码和解码

Base64 encoding and decoding in client-side Javascript

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


一些浏览器,如firefox、chrome、safari、opera和ie10+可以本地处理base64。看看这个stackoverflow问题。它使用的是btoa()atob()函数。

对于服务器端的javascript,node.js有一个btoa包。

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

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

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


在基于gecko/webkit的浏览器(firefox、chrome和safari)和opera中,可以使用btoa()和atob()。

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


互联网服务供应商

1
2
3
4
5
6
7
8
9
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!"

互联浏览器

Re-written and modularized UTF-8 and base 64 Javascript conducting and decoding libraries/modules for AMD,Commonjs,NODEJS and浏览器。互联浏览器

与节点

这里是您如何编码器正常文本以Base64 in node.js:

ZZU1

这里是你如何解码基底64码弦的:

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

和Dojo.js

To encode an array of bytes using dojox.encoding.base64:

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

To decode a base64-coded string:

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

鲍尔安装角

1
2
3
4
5
6
7
8
9
10
11
12
<script src="bower_components/angular-base64/angular-base64.js">

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

    '$base64', '$scope',
    function($base64, $scope) {

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

但是如何?

如果你想更多地了解如何在一般的基础上加密64,尤其是在Javascript中,我将推荐这篇文章:计算机科学在Javascript:Base64编码


这是一个加强版的狙击手的职位。它假定格式良好的base64字符串没有回车。这个版本消除了几个循环,从yaroslav添加了&0xff修正,消除了尾部的空值,加上一点代码高尔夫。

1
2
3
4
5
6
7
8
9
10
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;
};


短快速base64 javascript解码功能,无故障保护:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
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;
}


js项目有许多php函数的javascript实现。包括base64_encodebase64_decode


1
2
3
4
5
function b64_to_utf8( str ) {
  return decodeURIComponent(escape(window.atob( str )));
}

 https://developer.mozilla.org/en-US/docs/Web/API/WindowBase64/Base64_encoding_and_decoding#The_.22Unicode_Problem.22


有人说密码高尔夫吗?=)

以下是我在追赶时代的同时努力改善自己的障碍。为您提供方便。

1
2
3
4
5
6
7
8
9
function decode_base64(s) {
  var b=l=0, r='',
  m='ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/';
  s.split('').forEach(function (v) {
    b=(b<<6)+m.indexOf(v); l+=6;
    if (l>=8) r+=String.fromCharCode((b>>>(l-=8))&0xff);
  });
  return r;
}

我真正追求的是异步实现,令我惊讶的是,与jquery的$([]).each方法实现相比,forEach方法实现非常同步。

如果您也有这样疯狂的想法,那么0延迟window.setTimeout将异步运行base64解码,并在完成后执行回调函数。

1
2
3
function decode_base64_async(s, cb) {
  setTimeout(function () { cb(decode_base64(s)); }, 0);
}

@牙刷建议"像排成一列一样排成一条线",然后去掉split。这个程序看起来很奇怪,不确定它是否兼容,但它确实击中了另一只小鸟,所以让我们来看看。

1
2
3
4
5
6
7
8
9
function decode_base64(s) {
  var b=l=0, r='',
  m='ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/';
  [].forEach.call(s, function (v) {
    b=(b<<6)+m.indexOf(v); l+=6;
    if (l>=8) r+=String.fromCharCode((b>>>(l-=8))&0xff);
  });
  return r;
}

在试图找到更多关于javascript字符串作为数组的信息时,我无意中发现了这个专业技巧,它使用/./gregex来单步执行字符串。这通过将字符串替换到位并消除保留返回变量的需要,进一步减小了代码大小。

1
2
3
4
5
6
7
8
function decode_base64(s) {
  var b=l=0,
  m='ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/';
  return s.replace(/./g, function (v) {
    b=(b<<6)+m.indexOf(v); l+=6;
    return l<8?'':String.fromCharCode((b>>>(l-=8))&0xff);
  });
}

然而,如果你在寻找一些更传统的东西,也许下面的内容更符合你的口味。

1
2
3
4
5
6
7
8
9
function decode_base64(s) {
  var b=l=0, r='', s=s.split(''), i,
  m='ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/';
  for (i in s) {
    b=(b<<6)+m.indexOf(s[i]); l+=6;
    if (l>=8) r+=String.fromCharCode((b>>>(l-=8))&0xff);
  }
  return r;
}

我没有尾随的空值问题,所以这被删除,以保持在标准以下,但它应该很容易解决与trim()trimRight(),如果你愿意,这是否会给你带来问题。

IE.

1
return r.trimRight();

注:

结果是一个ASCII字节字符串,如果您需要Unicode,最简单的方法是使用escape字节字符串,然后可以使用decodeURIComponent对其进行解码以生成Unicode字符串。

1
2
3
function decode_base64_usc(s) {      
  return decodeURIComponent(escape(decode_base64(s)));
}

由于escape被否决,我们可以改变我们的功能来直接支持unicode,而不需要escapeString.fromCharCode我们可以生成一个%转义字符串,准备进行uri解码。

1
2
3
4
5
6
7
8
function decode_base64(s) {
  var b=l=0,
  m='ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/';
  return decodeURIComponent(s.replace(/./g, function (v) {
    b=(b<<6)+m.indexOf(v); l+=6;
    return l<8?'':'%'+(0x100+((b>>>(l-=8))&0xff)).toString(16).slice(-2);
  }));
}

尼乔!


我在phpjs.org上尝试过javascript例程,它们运行得很好。

我首先尝试了ranhiru cooray选择的答案中建议的例程-http://ntt.cc/2008/01/19/base64-encoder-decoder-with-javascript.html

我发现他们并非在任何情况下都能工作。我写了一个测试用例,其中这些例程失败,并将它们发布到Github:

https://github.com/scottcarter/base64_javascript_test_data.git

我也在ntt.cc的博客上发表了一条评论来提醒作者(等待修改——这篇文章已经过时了,所以不确定评论是否会被发表)。


现在,我们可以简单的方式做到这一点。

1
2
3
4
var base64 = 'SGVsbG8gV29ybGQ='
var base64_decode = new Buffer(base64, 'base64').toString('ascii');

console.log(base64_decode); //"Hello World"

我宁愿使用CryptoJS中的bas64编码/解码方法,CryptoJS是最流行的标准和安全加密算法库,使用最佳实践和模式在JavaScript中实现。