Как мне конвертировать из строки base64 в изображение с помощью Javascript

Question

У меня есть строка base64, и я хочу преобразовать эту строку base64 в Image, есть идеи, что я могу сделать?

Answer 1

Пожалуйста, используйте нижеприведенную функцию и передайте base64 в качестве dataurl, а имя файла в качестве имени файла в следующей функции.

function dataURLtoFile(dataurl, filename) {
var arr = dataurl.split(','), mime = arr[0].match(/:(.*?);/)[1],
    bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
while(n--){
    u8arr[n] = bstr.charCodeAt(n);
}
return new File([u8arr], filename, {type:mime});
}

Answer 2

Ваш html может обрабатывать base64, пока у вас есть 'data: image / png; base64,' как часть img src. Образец ниже.

<img src="data:image/png;base64, base64goeshere" alt="blah" />

Answer 3

просто добавьте data:image/png;base64, перед строкой base64 и добавьте ее в src вашего изображения.

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJYAAACWBAMAAADOL2zRAAAAG1BMVEXMzMyWlpaqqqq3t7fFxcW+vr6xsbGjo6OcnJyLKnDGAAAACXBIWXMAAA7EAAAOxAGVKw4bAAABAElEQVRoge3SMW+DMBiE4YsxJqMJtHOTITPeOsLQnaodGImEUMZEkZhRUqn92f0MaTubtfeMh/QGHANEREREREREREREtIJJ0xbH299kp8l8FaGtLdTQ19HjofxZlJ0m1+eBKZcikd9PWtXC5DoDotRO04B9YOvFIXmXLy2jEbiqE6Df7DTleA5socLqvEFVxtJyrpZFWz/pHM2CVte0lS8g2eDe6prOyqPglhzROL+Xye4tmT4WvRcQ2/m81p+/rdguOi8Hc5L/8Qk4vhZzy08DduGt9eVQyP2qoTM1zi0/uf4hvBWf5c77e69Gf798y08L7j0RERERERERERH9P99ZpSVRivB/rgAAAABJRU5ErkJggg==" alt="">

Answer 4

Попробуйте это

<img id="img"></img>
string base64="";
img.setAttribute('src', "data:image/jpg;base64," + base64);