Create a gist now

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Convert a base64 string into a binary Uint8 Array
var BASE64_MARKER = ';base64,';
function convertDataURIToBinary(dataURI) {
var base64Index = dataURI.indexOf(BASE64_MARKER) + BASE64_MARKER.length;
var base64 = dataURI.substring(base64Index);
var raw = window.atob(base64);
var rawLength = raw.length;
var array = new Uint8Array(new ArrayBuffer(rawLength));
for(i = 0; i < rawLength; i++) {
array[i] = raw.charCodeAt(i);
}
return array;
}
@PAEz

This comment has been minimized.

Show comment
Hide comment
@PAEz

PAEz Jul 1, 2011

Thanks, you made my day.

PAEz commented Jul 1, 2011

Thanks, you made my day.

@borismus

This comment has been minimized.

Show comment
Hide comment
@borismus

borismus Jul 2, 2011

Glad for it!

Owner

borismus commented Jul 2, 2011

Glad for it!

@Muffo

This comment has been minimized.

Show comment
Hide comment
@Muffo

Muffo Oct 3, 2013

Thanks for this script!

Muffo commented Oct 3, 2013

Thanks for this script!

@brettz9

This comment has been minimized.

Show comment
Hide comment
@brettz9

brettz9 Feb 5, 2014

Small nit: your "i" needs a "var" declaration to avoid it becoming global...

brettz9 commented Feb 5, 2014

Small nit: your "i" needs a "var" declaration to avoid it becoming global...

@sureshbora1989

This comment has been minimized.

Show comment
Hide comment
@sureshbora1989

sureshbora1989 Mar 6, 2014

Thanks Buddy :)

Thanks Buddy :)

@fabiosantoscode

This comment has been minimized.

Show comment
Hide comment

:) nice!

@sebasao

This comment has been minimized.

Show comment
Hide comment
@sebasao

sebasao Aug 1, 2014

fantastic!

sebasao commented Aug 1, 2014

fantastic!

@ajxs

This comment has been minimized.

Show comment
Hide comment
@ajxs

ajxs Jul 15, 2015

Real nice function!
Building on your example, if you're targeting Firefox and feeling adventurous you can shorten the function down to this:

var BASE64_MARKER = ';base64,';
function convertDataURIToBinaryFF(dataURI) { 
    var base64Index = dataURI.indexOf(BASE64_MARKER) + BASE64_MARKER.length; 
    var raw = window.atob(dataURI.substring(base64Index));
    return Uint8Array.from(Array.prototype.map.call(raw,function(x) { 
            return x.charCodeAt(0); 
        })); 
};

Unfortunately Uint8Array.from() isn't supported in other browsers yet. But this example might be useful someday!

ajxs commented Jul 15, 2015

Real nice function!
Building on your example, if you're targeting Firefox and feeling adventurous you can shorten the function down to this:

var BASE64_MARKER = ';base64,';
function convertDataURIToBinaryFF(dataURI) { 
    var base64Index = dataURI.indexOf(BASE64_MARKER) + BASE64_MARKER.length; 
    var raw = window.atob(dataURI.substring(base64Index));
    return Uint8Array.from(Array.prototype.map.call(raw,function(x) { 
            return x.charCodeAt(0); 
        })); 
};

Unfortunately Uint8Array.from() isn't supported in other browsers yet. But this example might be useful someday!

@IuryAlves

This comment has been minimized.

Show comment
Hide comment
@IuryAlves

IuryAlves Jul 23, 2015

Thanks! You save my week =D

Thanks! You save my week =D

@hungconcon

This comment has been minimized.

Show comment
Hide comment
@hungconcon

hungconcon Nov 17, 2015

I love you so much, same me a week, wanna invite you for a cup of coffee!

I love you so much, same me a week, wanna invite you for a cup of coffee!

@ICEDLEE337

This comment has been minimized.

Show comment
Hide comment
@ICEDLEE337

ICEDLEE337 Nov 28, 2015

Is there any way to make this work with IE 9?

Is there any way to make this work with IE 9?

@olegrise

This comment has been minimized.

Show comment
Hide comment
@olegrise

olegrise Jan 27, 2016

Nice! Worked like a charm for me. Thank you!

Nice! Worked like a charm for me. Thank you!

@Shilpa81

This comment has been minimized.

Show comment
Hide comment
@Shilpa81

Shilpa81 May 5, 2016

Hi , how to call this into jsp file , and we are using angular in our application ,,,,, can u plz help me on this

Shilpa81 commented May 5, 2016

Hi , how to call this into jsp file , and we are using angular in our application ,,,,, can u plz help me on this

@Bachir31

This comment has been minimized.

Show comment
Hide comment
@Bachir31

Bachir31 Dec 29, 2016

Thank you! you are great !!

Thank you! you are great !!

@noktilux

This comment has been minimized.

Show comment
Hide comment
@noktilux

noktilux Sep 8, 2017

Thank you. This was very helpful.

I am using this modified version (made it a little more brief) with option to return the buffer:

function uri2array(uri, buffer) {
    var marker = ';base64,',
        raw = window.atob(uri.substring(uri.indexOf(marker) + marker.length)),
        n = raw.length,
        a = new Uint8Array(new ArrayBuffer(n));
    for(var i = 0; i < n ; i++){
        a[i] = raw.charCodeAt(i);
    }
    return buffer ? a.buffer : a;
}

noktilux commented Sep 8, 2017

Thank you. This was very helpful.

I am using this modified version (made it a little more brief) with option to return the buffer:

function uri2array(uri, buffer) {
    var marker = ';base64,',
        raw = window.atob(uri.substring(uri.indexOf(marker) + marker.length)),
        n = raw.length,
        a = new Uint8Array(new ArrayBuffer(n));
    for(var i = 0; i < n ; i++){
        a[i] = raw.charCodeAt(i);
    }
    return buffer ? a.buffer : a;
}
@vaibhavpacharya

This comment has been minimized.

Show comment
Hide comment
@vaibhavpacharya

vaibhavpacharya Oct 21, 2017

Chrome throws an error saying "dataURI.indexOf is not a function"

Chrome throws an error saying "dataURI.indexOf is not a function"

@anilljoshi

This comment has been minimized.

Show comment
Hide comment
@anilljoshi

anilljoshi Mar 28, 2018

Cannot read property 'indexOf' of undefined

Cannot read property 'indexOf' of undefined

@hermeslm

This comment has been minimized.

Show comment
Hide comment
@hermeslm

hermeslm May 4, 2018

I tried some others, but this works like charm!!! thanks.

hermeslm commented May 4, 2018

I tried some others, but this works like charm!!! thanks.

@lol-to-troll

This comment has been minimized.

Show comment
Hide comment
@lol-to-troll

lol-to-troll Jun 19, 2018

@borismus please declare the variable "i" in the loop. Since it's not defined it works sometimes (if i is defined elsewhere in code) and doesn't work other time.
check for bold in the below code.

Thank you so much for the code.

function convertDataURIToBinary(dataURI) {
var base64Index = dataURI.indexOf(BASE64_MARKER) + BASE64_MARKER.length;
var base64 = dataURI.substring(base64Index);
var raw = window.atob(base64);
var rawLength = raw.length;
var array = new Uint8Array(new ArrayBuffer(rawLength));

for(let i = 0; i < rawLength; i++) {
array[i] = raw.charCodeAt(i);
}
return array;
}

@borismus please declare the variable "i" in the loop. Since it's not defined it works sometimes (if i is defined elsewhere in code) and doesn't work other time.
check for bold in the below code.

Thank you so much for the code.

function convertDataURIToBinary(dataURI) {
var base64Index = dataURI.indexOf(BASE64_MARKER) + BASE64_MARKER.length;
var base64 = dataURI.substring(base64Index);
var raw = window.atob(base64);
var rawLength = raw.length;
var array = new Uint8Array(new ArrayBuffer(rawLength));

for(let i = 0; i < rawLength; i++) {
array[i] = raw.charCodeAt(i);
}
return array;
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment