Кодирование и декодирование Base64 в Javascript на стороне клиента
есть ли какие-либо методы в JavaScript, которые могут быть использованы для кодирования и декодирования строки с помощью кодировки base64?
12 ответов
некоторые браузеры, такие как Firefox, Chrome, Safari, Opera и IE10+, могут обрабатывать Base64 изначально. Взгляните на это Stackoverflow вопрос. Он использует btoa()
и atob()
функции.
для серверного JavaScript, есть пакет btoa для узла.JS.
Если вы собираетесь использовать кросс-браузерное решение, существуют такие библиотеки, как CryptoJS или код например:
http://ntt.cc/2008/01/19/base64-encoder-decoder-with-javascript.html
С последним, вам нужно тщательно протестировать функцию для кросс-совместимости браузера. И ошибка уже сообщал.
в браузерах на основе Gecko / WebKit (Firefox, Chrome и Safari) и Opera вы можете использовать btoa () и atob выступает().
оригинальный ответ: как вы можете кодировать строку в Base64 в JavaScript?
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!"
Кросс-Браузер
С узла.js
вот как вы кодируете обычный текст в base64 в узле.js:
//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.кодирование.в base64:
var str = dojox.encoding.base64.encode(myByteArray);
для декодирования строки в кодировке base64:
var bytes = dojox.encoding.base64.decode(str)
bower установить угловой-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
вот ужесточенная версия поста снайпера. Он предполагает хорошо сформированную строку base64 без возврата каретки. Эта версия устраняет пару циклов, добавляет &0xff
fix от Ярослава, устраняет трейлинг-нули, плюс немного кода golf.
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 без сбоев:
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;
}
на php.js проект имеет реализации JavaScript многих функций PHP. base64_encode
и base64_decode
включены.
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
Я пробовал подпрограммы Javascript на phpjs.org и они хорошо работали.
Я сначала попробовал процедуры, предложенные в выбранном ответе Ранхиру курей -http://ntt.cc/2008/01/19/base64-encoder-decoder-with-javascript.html
Я обнаружил, что они не работают во всех случаях. Я написал тестовый случай, когда эти процедуры терпят неудачу и отправил их в GitHub at:
https://github.com/scottcarter/base64_javascript_test_data.git
Я также опубликовал комментарий к сообщению в блоге по адресу ntt.cc чтобы предупредить автора (в ожидании модерации-статья старая, поэтому не уверен, будет ли опубликован комментарий).
кто-то сказал код гольф? =)
ниже приводится моя попытка улучшить мой гандикап, догоняя время. Поставляется для вашего удобства.
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;
}
то, что я на самом деле был после асинхронной реализации, и, к моему удивлению, оказывается forEach
в отличие от jQuery $([]).each
реализация метода очень синхронно.
если у вас также были такие сумасшедшие понятия в виду задержки 0 window.setTimeout
запустит декодирование base64 асинхронно и выполнить функцию обратного вызова с результатом, когда сделано.
function decode_base64_async(s, cb) {
setTimeout(function () { cb(decode_base64(s)); }, 0);
}
@Toothbrush предложил "индексировать строку как массив" и избавиться от split
. Эта процедура кажется очень странной и не уверена, насколько совместимой она будет, но она поражает другую птичку, так что давайте ее.
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 в виде массива я наткнулся на этот профессиональный совет, используя /./g
регулярное выражение для перехода через строку. Это уменьшает размер кода еще больше, заменив строку на место и исключив необходимость сохранения возвращаемой переменной.
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);
});
}
Если, однако, вы искали что-то более традиционное, возможно, следующее вам больше по вкусу.
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.
return r.trimRight();
Примечание:
результатом является строка байта ascii, если вам нужен unicode, проще всего escape
строка байта, которая затем может быть декодирована с помощью decodeURIComponent
для создания строки unicode.
function decode_base64_usc(s) {
return decodeURIComponent(escape(decode_base64(s)));
}
С escape
устарело мы могли бы изменить нашу функцию для поддержки unicode напрямую без необходимости escape
или String.fromCharCode
мы можем произвести %
экранированная строка готова для URI декодирование.
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);
}));
}
кафе!
Я бы предпочел использовать методы кодирования/декодирования bas64 из CryptoJS, самая популярная библиотека для стандартных и безопасных криптографических алгоритмов, реализованных на JavaScript с использованием лучших практик и моделей.
В Узел.js мы можем сделать это простым способом
var base64 = 'SGVsbG8gV29ybGQ='
var base64_decode = new Buffer(base64, 'base64').toString('ascii');
console.log(base64_decode); // "Hello World"