¿Blob de DataURL?
Usando FileReader's readAsDataURL()puedo transformar datos arbitrarios en una URL de datos. ¿Existe alguna forma de volver a convertir una URL de datos en una Blobinstancia utilizando las API integradas del navegador?
El usuario Matt propuso el siguiente código hace un año (¿ Cómo convertir dataURL en un objeto de archivo en javascript? ) que podría ayudarle
EDITAR: Como informaron algunos comentaristas, BlobBuilder quedó obsoleto hace algún tiempo. Este es el código actualizado:
function dataURItoBlob(dataURI) {
// convert base64 to raw binary data held in a string
// doesn't handle URLEncoded DataURIs - see SO answer #6850276 for code that does this
var byteString = atob(dataURI.split(',')[1]);
// separate out the mime component
var mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0]
// write the bytes of the string to an ArrayBuffer
var ab = new ArrayBuffer(byteString.length);
// create a view into the buffer
var ia = new Uint8Array(ab);
// set the bytes of the buffer to the correct values
for (var i = 0; i < byteString.length; i++) {
ia[i] = byteString.charCodeAt(i);
}
// write the ArrayBuffer to a blob, and you're done
var blob = new Blob([ab], {type: mimeString});
return blob;
}
Como el método @Adria pero con Fetch api y solo más pequeño [ caniuse? ]
No es necesario pensar en el tipo MIME, ya que el tipo de respuesta blob simplemente funciona de inmediato.
Advertencia: puede violar la Política de seguridad de contenido (CSP)
... si usas esas cosas
var url = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg=="
fetch(url)
.then(res => res.blob())
.then(blob => console.log(blob))No creas que podrías hacerlo más pequeño que esto sin usar lib's
En los navegadores modernos se puede utilizar la línea sugerida por Christian d'Heureuse en un comentario:
const blob = await (await fetch(dataURI)).blob();
