Bind binary data from the ajax call response to sap.m.Image control.

[former_member356284]

Hello All,

I am trying to bind the response of the ajax call (which is a binary data) with sap.m.Image control.

But I couldnot see image in the control.

FYI.

I had to bind response from the ajax call because the service call because the service URL requires an access Token to be passed to it, then only I can see the image in the response.

Thanks,

Aakanksha

[rohit_singhal]

Hi Aakanksha,

Could you please share how you are binding the control to the call.

BR,

Rohit

[former_member540067 · Accepted solution]

Ok so i tried the same and got the issue as you said in reply to my previous answer. Below solution works quite fine. Please change it as per your requirement.

$.ajax({
	url: "imageUrl",
	beforeSend: function (xhr) {
		xhr.overrideMimeType('text/plain; charset=x-user-defined');
	},
	success: function (result, textStatus, jqXHR) {
		if (result.length < 1) {
			console.log("The thumbnail doesn't exist");
			return;
		}
		var binary = "";
		var responseText = jqXHR.responseText;
		var responseTextLen = responseText.length;


		for (var i = 0; i < responseTextLen; i++) {
			binary += String.fromCharCode(responseText.charCodeAt(i) & 255);
		}


		that.getView().byId("imageId").setSrc("data:image/png;base64," + btoa(binary));
	}
});

Regards

Anmol

[former_member356284 · Accepted solution]

Thanks Anmol.

It worked for me.

Regards,

Aakanksha

[former_member540067 · Accepted solution]

That's Great.

Regards

Anmol

[former_member540067]

Hi aakanksha.gupta

You can use

that.getView().byId("imageId").setSrc('data:image/png;base64,' + btoa(binary_data));

Here binary_data is the response from your Ajax call and "that" is a variable declared outside the ajax call:

let that=this;

Regards

Anmol

[former_member356284]

Hi Anmol.

Thanks for your response.

Actually I tried this, but I am getting below error from btoa command.

capture.pngcapture1.png

Here ImageSrc consists of the binary Data.

[former_member540067]

Ah!. Looks like your data contain some invalid data.

Can you confirm if your data is Binary or Base64 already or if you can post a snippet of the ajax call success response?

Regards

Anmol

[former_member540067]

And in the workaround, ask the image provider to return in base64.