When I make a call to an external API, it returns image data that I want to render on my page.
However, the response looks like this when I log it to the console:
https://i.stack.imgur.com/GpDhH.png
I'm not very familiar with image formats, so I've been searching online to find out how to convert this type of return to the necessary format for displaying it on my page, but I haven't had any luck.
This is how my API call is set up:
$.ajax({
type: 'GET',
beforeSend: function (xhr) {
xhr.setRequestHeader('t', ts);
},
url: "https://someservice.com/DataService.svc/ConsumerMedia(guid'" + imageQuid + "')/$value",
data: rBody,
cache: true,
contentType: "image/png",
dataType: "text",
success: function (data) {
console.log(data);
// Convert data to relevant format here
// Then display image as below
$('#photo').attr("src", "data:image/png;base64," + data + "");
},
error: function (request, error) {
}
});
If anyone can offer guidance on how to format the response in order to display it on the page, I would greatly appreciate it.