0
394
Vistas¿Cómo puedo convertir los datos que son una imagen que provienen de la API a la URL para usar en la etiqueta img en reaccionar Js?
He subido una imagen. Ahora, tengo una API de descarga que me da esta imagen como datos. La respuesta se ve así:
el encabezado de la respuesta es así:
Ahora el problema es que quiero mostrar esta imagen en la página web usando la etiqueta img o cualquier otra cosa posible en reaccionar js. Pasar el contenido a src attr no muestra nada. ¿Alguien tiene alguna idea? ¿Hay alguna manera posible?
·
Juan Pablo Isaza
2 Respuestas
Responde la pregunta0
Debería poder usar FileReader para convertir la respuesta al formato base64 que se puede usar en el atributo src:
// Request was successful, get image blob const blob = await response.blob() // Convert the blob to base64 const reader = new FileReader() reader.readAsDataURL(blob) // Get the converted image and set it where needed reader.onloadend = () => { const base64Image = reader.result // Set the image to the src of the image tag or setState as you need }
·
Juan Pablo Isaza
Denunciar
0
Esto también funcionó para mí además de la respuesta anterior:
const fetchImage = async () => { fetch(apiUrl, { method: 'get', headers: new Headers({ Authorization: `Bearer ${getCookie('accessToken')}`, }), }) .then((response) => response.blob()) .then((myBlob) => { const objectURL = URL.createObjectURL(myBlob); setImageUrl(objectURL); });};
·
Juan Pablo Isaza
Denunciar
Responde la pregunta