Develop Reference

How to duplicate symfony passwordEncode in javascript

I need to create a javascript hashing algorithm the same as Symfony 3 encodePassword.
This was a similar problem to that in but in symfony3:
Symfony2 password encoder function in Javascript
this is to create a message digest to test a rest endpoint with wsse headers in Symfony with fosbundle in postman.
I've managed to simplify and duplicate the Symfony hashing function in PHP
$pass = "hello";
$salt = "";
$iterations=5000;
echo $this->encoder->encodePassword($pass,$salt);
//contains: U5xyFq7KQU1CWeX3UcLB0mwWZZQUq0PL8U+GLWomfGW/WQWxxGLi+0ifhmnlw/gQ5pPjNNZV1/q8kMVpAXsFZw==
//simplyfying and replicating the hashing algo in php with same pass/salt:
$salted = $pass.$salt;
$digest = hash("sha512", $salted, true);
for($i=1; $i<$iterations; $i++) {
$digest = hash("sha512", $digest.$salted, true);
}
echo base64_encode($digest);
//contains: U5xyFq7KQU1CWeX3UcLB0mwWZZQUq0PL8U+GLWomfGW/WQWxxGLi+0ifhmnlw/gQ5pPjNNZV1/q8kMVpAXsFZw==
but trying to replicate it in javascript using CryptoJS is proving troublesome. I suspect its to do with the character encoding too.
according to https://code.google.com/archive/p/crypto-js/#The_Hasher_Input
The hash algorithms accept either strings or instances of
CryptoJS.lib.WordArray [...] an array of 32-bit words. When you pass a
string, it's automatically converted to a WordArray encoded as UTF-8.
password = 'hello';
//attempt 1 use hex converted pass
hexpass = CryptoJS.enc.Utf8.parse(password);
digest = CryptoJS.SHA512(hexpass);
for (i = 1; i < 5000; ++i) {
hexvar = CryptoJS.SHA512(digest + hexpass);
}
digest = digest.toString(CryptoJS.enc.Base64);
console.log(digest);
// need hash to contain: U5xyFq7KQU1CWeX3UcLB0mwWZZQUq0PL8U+GLWomfGW/WQWxxGLi+0ifhmnlw/gQ5pPjNNZV1/q8kMVpAXsFZw==
<script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/3.1.9-1/crypto-js.min.js"></script>
I've tried many different ways to with converting to word array first etc. but none seem to come up with the same hash
https://jsfiddle.net/munkiepus/awdoq4kL/34/
EDIT: i think the problem is that the php uses some form of raw binary
outputting the result of $digest = hash("sha512", $salted, true); to the terminal shows:
▒q▒$▒b▒x]▒▒j▒▒=s1▒▒�
▒▒▒▒▒%g<▒##▒ٛ▒▒|z▒n▒▒▒
FcG.:▒▒os▒▒▒C
so maybe it's not possible in JS after all. if the digest was encoded to a readable string during each iteration then it may be possible, as in the linked example.

Ok so it was the binary data causing the problem, if we convert the word array into a binary string it works.
needed some other functions to do the conversions see the runnable example for the functions. example
hashWordArray = CryptoJS.SHA512(password);
uint8array = convertWordArrayToUint8Array(hashWordArray);
binaryString = convertUint8ArrayToBinaryString(uint8array);
for (var i=1; i<5000; i++) {
wordArrayFromString = CryptoJS.enc.Latin1.parse(binaryString+password);
hashWordArray = CryptoJS.SHA512(wordArrayFromString);
uint8array = convertWordArrayToUint8Array(hashWordArray);
binaryString = convertUint8ArrayToBinaryString(uint8array);
}
b64_encoded = btoa(binaryString);
const password = "hello";
// set up the container to display output
var div = document.getElementById('message');
div.innerHTML += 'string to hash:<br>';
div.innerHTML += password+'<br><br>';
div.innerHTML += 'php generated hash:<br>';
correct_hash = 'U5xyFq7KQU1CWeX3UcLB0mwWZZQUq0PL8U+GLWomfGW/WQWxxGLi+0ifhmnlw/gQ5pPjNNZV1/q8kMVpAXsFZw=='
div.innerHTML += correct_hash+'<br><br>';
//actually do the hashing
hashWordArray = CryptoJS.SHA512(password);
uint8array = convertWordArrayToUint8Array(hashWordArray);
binaryString = convertUint8ArrayToBinaryString(uint8array);
for (var i=1; i<5000; i++) {
wordArrayFromString = CryptoJS.enc.Latin1.parse(binaryString+password);
hashWordArray = CryptoJS.SHA512(wordArrayFromString);
uint8array = convertWordArrayToUint8Array(hashWordArray);
binaryString = convertUint8ArrayToBinaryString(uint8array);
}
b64_encoded = btoa(binaryString);
// add the outputr to the display container
div.innerHTML += 'javascript generated hash:<br>';
div.innerHTML += b64_encoded +"<br><br>"; //b64_encode()
// functions from
// https://gist.github.com/getify/7325764
function convertWordArrayToUint8Array(wordArray) {
var len = wordArray.words.length,
u8_array = new Uint8Array(len << 2),
offset = 0, word, i
;
for (i=0; i<len; i++) {
word = wordArray.words[i];
u8_array[offset++] = word >> 24;
u8_array[offset++] = (word >> 16) & 0xff;
u8_array[offset++] = (word >> 8) & 0xff;
u8_array[offset++] = word & 0xff;
}
return u8_array;
}
function convertUint8ArrayToBinaryString(u8Array) {
var i, len = u8Array.length, b_str = "";
for (i=0; i<len; i++) {
b_str += String.fromCharCode(u8Array[i]);
}
return b_str;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/3.1.9-1/crypto-js.min.js"></script>
<div id="message"></div>

Why do you need that? The best thing is that you only encrypt it on one side, either from JS or Symfony and only compare the hashes.
The other option is to not use encodePassword() and use md5() for example.
In this link shows you how it works encodePassword().
Regards!

Hex to Windows-1251 with JavaScript

I'm trying to convert a hexadecimal string to string with Windows-1251 encoding. I need to use JavaScript. I've tried using this sample that someone posted:
var win1251 = new TextDecoder("windows-1251");
for (var i = 0x00; i < 0xFF; i++) {
var hex = (i <= 0x0F ? "0" : "") + i.toString(16).toUpperCase();
decodeMap[hex] = win1251.decode(Uint8Array.from([i]));
}
but I can't seem to make it work. Can someone please help out?

Propably you're using it in incorrect way.
The code in you post creates dictionary (hex => windows-1251).
So, to translate hex string to windows-1251 string you have to:
split your hex string into array with 2-hex elements
Translate every element to windows-1251
Join result array into string
var decodeMap = {};
var win1251 = new TextDecoder("windows-1251");
for (var i = 0x00; i < 0xFF; i++) {
var hex = (i <= 0x0F ? "0" : "") + i.toString(16).toUpperCase();
decodeMap[hex] = win1251.decode(Uint8Array.from([i]));
}
var number = "3230313830363131313535303435303831";
var hexarr = number.toUpperCase().match(/[0-9A-F]{2}/g)
var win1251arr = hexarr.map(el=> decodeMap[el]);
console.log(win1251arr.join(""))
You can also do it in much shorter way (directly translate your hex string without creating dictionary):
var win1251 = new TextDecoder("windows-1251");
var number = "3230313830363131313535303435303831";
var arr = number.toUpperCase().match(/[0-9A-F]{2}/g).map(el=>"0x"+el);
var uarr = Uint8Array.from(arr);
console.log(win1251.decode(uarr));
If your browser doesn't support TextDecoder, you can use dictionary from first snippet:
var decodeMap = getHexToWin1251Dictionary();
var number = "3230313830363131313535303435303831";
var hexarr = number.toUpperCase().match(/[0-9A-F]{2}/g)
var win1251arr = hexarr.map(el=> decodeMap[el]);
console.log(win1251arr.join(""))
// function below returns content of decodeMap from first snippet
function getHexToWin1251Dictionary(){
return {"10":"\u0010","11":"\u0011","12":"\u0012","13":"\u0013","14":"\u0014","15":"\u0015","16":"\u0016","17":"\u0017","18":"\u0018","19":"\u0019","20":" ","21":"!","22":"\"","23":"#","24":"$","25":"%","26":"&","27":"'","28":"(","29":")","30":"0","31":"1","32":"2","33":"3","34":"4","35":"5","36":"6","37":"7","38":"8","39":"9","40":"#","41":"A","42":"B","43":"C","44":"D","45":"E","46":"F","47":"G","48":"H","49":"I","50":"P","51":"Q","52":"R","53":"S","54":"T","55":"U","56":"V","57":"W","58":"X","59":"Y","60":"`","61":"a","62":"b","63":"c","64":"d","65":"e","66":"f","67":"g","68":"h","69":"i","70":"p","71":"q","72":"r","73":"s","74":"t","75":"u","76":"v","77":"w","78":"x","79":"y","80":"Ђ","81":"Ѓ","82":"‚","83":"ѓ","84":"„","85":"…","86":"†","87":"‡","88":"€","89":"‰","90":"ђ","91":"‘","92":"’","93":"“","94":"”","95":"•","96":"–","97":"—","98":"","99":"™","00":"\u0000","01":"\u0001","02":"\u0002","03":"\u0003","04":"\u0004","05":"\u0005","06":"\u0006","07":"\u0007","08":"\b","09":"\t","0A":"\n","0B":"\u000b","0C":"\f","0D":"\r","0E":"\u000e","0F":"\u000f","1A":"\u001a","1B":"\u001b","1C":"\u001c","1D":"\u001d","1E":"\u001e","1F":"\u001f","2A":"*","2B":"+","2C":",","2D":"-","2E":".","2F":"/","3A":":","3B":";","3C":"<","3D":"=","3E":">","3F":"?","4A":"J","4B":"K","4C":"L","4D":"M","4E":"N","4F":"O","5A":"Z","5B":"[","5C":"\\","5D":"]","5E":"^","5F":"_","6A":"j","6B":"k","6C":"l","6D":"m","6E":"n","6F":"o","7A":"z","7B":"{","7C":"|","7D":"}","7E":"~","7F":"","8A":"Љ","8B":"‹","8C":"Њ","8D":"Ќ","8E":"Ћ","8F":"Џ","9A":"љ","9B":"›","9C":"њ","9D":"ќ","9E":"ћ","9F":"џ","A0":" ","A1":"Ў","A2":"ў","A3":"Ј","A4":"¤","A5":"Ґ","A6":"¦","A7":"§","A8":"Ё","A9":"©","AA":"Є","AB":"«","AC":"¬","AD":"­","AE":"®","AF":"Ї","B0":"°","B1":"±","B2":"І","B3":"і","B4":"ґ","B5":"µ","B6":"¶","B7":"·","B8":"ё","B9":"№","BA":"є","BB":"»","BC":"ј","BD":"Ѕ","BE":"ѕ","BF":"ї","C0":"А","C1":"Б","C2":"В","C3":"Г","C4":"Д","C5":"Е","C6":"Ж","C7":"З","C8":"И","C9":"Й","CA":"К","CB":"Л","CC":"М","CD":"Н","CE":"О","CF":"П","D0":"Р","D1":"С","D2":"Т","D3":"У","D4":"Ф","D5":"Х","D6":"Ц","D7":"Ч","D8":"Ш","D9":"Щ","DA":"Ъ","DB":"Ы","DC":"Ь","DD":"Э","DE":"Ю","DF":"Я","E0":"а","E1":"б","E2":"в","E3":"г","E4":"д","E5":"е","E6":"ж","E7":"з","E8":"и","E9":"й","EA":"к","EB":"л","EC":"м","ED":"н","EE":"о","EF":"п","F0":"р","F1":"с","F2":"т","F3":"у","F4":"ф","F5":"х","F6":"ц","F7":"ч","F8":"ш","F9":"щ","FA":"ъ","FB":"ы","FC":"ь","FD":"э","FE":"ю"};
}

How do you convert from ArrayBuffer to byte array in javascript? [duplicate]

I want to read a binary file in JavaScript that would be gotten through XMLHttpRequest and be able to manipulate that data. From my researching I discovered this method of reading a binary file data into an array
var xhr = new XMLHttpRequest();
xhr.open('GET', '/binary_And_Ascii_File.obj', true);
xhr.responseType = 'arraybuffer';
xhr.onload = function(e) {
var uInt8Array = new Uint8Array(this.response);
};
How do I convert this binary data array to a human-readable-string?

I'm sure you will find this helpful: http://jsdo.it/tsmallfield/uint8array.
Click on javascript tab.
There will appear the code to convert the Uint8Array in a string. The author shows 2 method:
The first is about creating a view.
The second offsetting bytes.
EDIT: report the code for completeness
var buffer = new ArrayBuffer( res.length ), // res is this.response in your case
view = new Uint8Array( buffer ),
len = view.length,
fromCharCode = String.fromCharCode,
i, s, str;
/**
* 1) 8bitの配列に入れて上位ビットけずる
*/
str = "";
for ( i = len; i--; ) {
view[i] = res[i].charCodeAt(0);
}
for ( i = 0; i < len; ++i ) {
str += fromCharCode( view[i] );
}
/**
* 2) & 0xff で上位ビットけずる
*/
str = "";
for ( i = 0; i < len; ++i ) {
str += fromCharCode( res[i].charCodeAt(0) & 0xff );
}

function load_binary_resource(url) {
var byteArray = [];
var req = new XMLHttpRequest();
req.open('GET', url, false);
req.overrideMimeType('text\/plain; charset=x-user-defined');
req.send(null);
if (req.status != 200) return byteArray;
for (var i = 0; i < req.responseText.length; ++i) {
byteArray.push(req.responseText.charCodeAt(i) & 0xff)
}
return byteArray;
}
See https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Sending_and_Receiving_Binary_Data for more details

Convert base64 string into byte array through javascript

I want to convert "base64" string into bytes array through the javascript.
I received string from the URL like.
("data:image/jpeg;base64,/9j/4QN6RXhpZgAASUkqAAgAAAAIA)
And i want to convert the string into bytes array. because i need this byte array to send Rest API endpoint. The rest API Content-type=application/octet-stream.

You can use XMLHttpRequest to do the dirty work for you:
var url = document.createElement("canvas").toDataURL(); // some data-uri
var xhr = new XMLHttpRequest();
xhr.open("GET", url);
xhr.responseType = "arraybuffer";
xhr.onload = function() {
// result = ArrayBuffer, from here assign a view to it
if (xhr.status === 200) console.log(new Uint8Array(xhr.response));
};
xhr.send();
It's a little more code than using atob() but all conversion happens internally. It's async too which can help with larger Data-URIs.
In newer browsers (which supports it) you can instead use fetch():
// note: atm not all browsers support these features.
fetch(document.createElement("canvas").toDataURL()) // pass in some data-uri
.then(function(response) {return response.arrayBuffer()})
.then(function(buffer) {
console.log(new Uint8Array(buffer));
});

You can try with the following;
function test(base64StringFromURL)
{
var parts = base64StringFromURL.split(";base64,");
var contentType = parts[0].replace("data:", "");
var base64 = parts[1];
var byteArray = base64ToByteArray(base64);
..
}
function base64ToByteArray(base64String) {
try {
var sliceSize = 1024;
var byteCharacters = atob(base64String);
var bytesLength = byteCharacters.length;
var slicesCount = Math.ceil(bytesLength / sliceSize);
var byteArrays = new Array(slicesCount);
for (var sliceIndex = 0; sliceIndex < slicesCount; ++sliceIndex) {
var begin = sliceIndex * sliceSize;
var end = Math.min(begin + sliceSize, bytesLength);
var bytes = new Array(end - begin);
for (var offset = begin, i = 0; offset < end; ++i, ++offset) {
bytes[i] = byteCharacters[offset].charCodeAt(0);
}
byteArrays[sliceIndex] = new Uint8Array(bytes);
}
return byteArrays;
} catch (e) {
console.log("Couldn't convert to byte array: " + e);
return undefined;
}
}

This would prove to be much short solution.
const byteArray = new Buffer(base64String.replace(/^[\w\d;:\/]+base64\,/g, ''), 'base64');
base64String is the string containing the base 64 string.
byteArray is the array you need.
The regex replacement is optional and is just there to deal with prefix as in the case of dataurl string.

Encrypting files with SJCL client-side

I have problem encrypting files with SJCL and javascript.
I have managed to encrypt text-files with using FileReader API and readAsBinaryString.
When it comes to encrypting pdf/png/.. then problem arrises probably due to encoding.
I found that I can use readAsArrayBuffer which suits this task perfectly, so I basically read file and create new typed array with new Uint8Array() but i dont know how exactly I am supposed to encrypt such a data.
Here's my code:
/** Convert from an array of bytes to a bitArray. */
function toBitArrayCodec(bytes) {
var out = [], i, tmp=0;
for (i=0; i<bytes.length; i++) {
tmp = tmp << 8 | bytes[i];
if ((i&3) === 3) {
out.push(tmp);
tmp = 0;
}
}
if (i&3) {
out.push(sjcl.bitArray.partial(8*(i&3), tmp));
}
return out;
}
/** Convert from a bitArray to an array of bytes. */
function fromBitArrayCodec(arr) {
var out = [], bl = sjcl.bitArray.bitLength(arr), i, tmp;
for (i=0; i<bl/8; i++) {
if ((i&3) === 0) {
tmp = arr[i/4];
}
out.push(tmp >>> 24);
tmp <<= 8;
}
return out;
}
var reader = new FileReader();
reader.readAsArrayBuffer(fileData); //filedata comes from function
reader.onload = function() {
var bytes = new Uint8Array(reader.result);
var bits = toBitArrayCodec(bytes);
var crypt = sjcl.encrypt("aaaaa", bits);
var decrypt = sjcl.decrypt("aaaaa", crypt);
var byteNumbers = fromBitArrayCodec(decrypt);
var byteArray = new Uint8Array(byteNumbers);
saveData(byteArray, 'png.png');
I am getting error on
Uncaught URIError: URI malformed sjcl.js:12sjcl.codec.utf8String.fromBits sjcl.js:12sjcl.json.decrypt sjcl.js:44reader.onload
I need to know how to encrypt uint8array or another alternative how to encrypt(pdf/png/..) files.

The plaintext in sjcl is expected to be utf8 encoded. Encrypting a manually built bitArray works, because the encryption is done on the bitArray and it doesn't have to be decoded. But at the end of the decryption is an encoding step which converts the recovered plaintext bitArray into a utf8string. This doesn't work, because it contains unprintable characters, because the source was probably binary.
The solution would be to encode it as Base64 before encrypting and convert it back after decrypting.
var bytes = new Uint8Array(reader.result);
var bits = toBitArrayCodec(bytes);
var base64bits = sjcl.codec.base64.fromBits(bits); // added
var crypt = sjcl.encrypt("aaaaa", base64bits);
var base64decrypt = sjcl.decrypt("aaaaa", crypt);
var decrypt = sjcl.codec.base64.toBits(base64decrypt); // added
var byteNumbers = fromBitArrayCodec(decrypt);
var byteArray = new Uint8Array(byteNumbers);