I have a function which pings my server and tries to download a file from a DB
const handleDownloadFileData = async (id) => {
const res = await downloadServiceFileData(id)
console.log(res.data)
}
the output of res.data looks as so:
/9j/4AAQSkZJRgABAQAASABIAAD/4QCKRXhpZgAATU0AKgAAAAgAAgESAAMAAAABAAEAAIdpAAQAAAABAAAAJgAAAAAABJADAAIAAAAUAAAAXJKGAAcAAAASAAAAcKACAAQAAAABAAAC7qADAAQAAAABAAAFNgAAAAAyMDIxOjAyOjE2IDAxOjE0OjA3AEFTQ0lJAAAAU2NyZWVuc2hvdP/tADhQaG90b3Nob3AgMy4wADhCSU0EBAAAAAAAADhCSU0EJQAAAAAAENQdjNmPALIE6YAJmOz4Qn7/4nYwSUNDX1BST0ZJTEUAAQ...
I assume this is some kind of decoded Base64??
Can I build the file from this data and display the file in a new tab perhaps? and if so how? Sorry for the ignorance but I have never done this type of development before.
downloadServiceFileData
export async function downloadServiceFileData(fileDataId) {
try {
return await awsApiRequest({
method: 'GET',
path: `/file-data/${fileDataId}`,
});
} catch (error) {
return error;
}
}
You can do it with simple fetch api
const decodedString = "/9j/4AAQSkZJRgABAQAASABIAAD/4QCKRXhpZgAATU0AKgAAAAgAAgESAAMAAAABAAEAAIdpAAQAAAABAAAAJgAAAAAABJADAAIAAAAUAAAAXJKGAAcAAAASAAAAcKACAAQAAAABAAAC7qADAAQAAAABAAAFNgAAAAAyMDIxOjAyOjE2IDAxOjE0OjA3AEFTQ0lJAAAAU2NyZWVuc2hvdP/tADhQaG90b3Nob3AgMy4wADhCSU0EBAAAAAAAADhCSU0EJQAAAAAAENQdjNmPALIE6YAJmOz4Qn7/4nYwSUNDX1BST0ZJTEUAAQ..."
let type = 'application/octet-stream'
let blob = null;
fetch(`data:${type};base64,${decodedString}`).then(res=>blob =res.blob())
//File constructor
var file = new File([blob], "name");