How can I strip the data:image part from a base64 string of any image type in Javascript

Question

I am currently doing the following to decode base64 images in Javascript:

    var strImage = "";
    strImage = strToReplace.replace("data:image/jpeg;base64,", "");
    strImage = strToReplace.replace("data:image/png;base64,", "");
    strImage = strToReplace.replace("data:image/gif;base64,", "");
    strImage = strToReplace.replace("data:image/bmp;base64,", "");

As you can see above we are accepting the four most standard image types (jpeg, png, gif, bmp);

However, some of these images are very large and scanning through each one 4-5 times with replace seems a dreadful waste and terribly inefficient.

Is there a way I could reliably strip the data:image part of a base64 image string in a single pass?

Perhaps by detecting the first comma in the string?

Thanks in advance.

Answer 1

You can use a regular expression:

var strImage = strToReplace.replace(/^data:image\/[a-z]+;base64,/, "");

---

• ^ means At the start of the string
• data:image means data:image
• \/ means /
• [a-z]+ means One or more characters between a and z
• ;base64, means ;base64,

Answer 2

var solution = string.split("base64,")[1];

Splits the variable string at "base64," than take the second part.