Visualize API response Base64 Image display

When I attempt to display a base64 string image (returned in the response) in the Handlebars template when using the Visualize API I receive the following error.

Refused to load the image ‘data:image/JPG;base64,Base64StringHere’ because it violates the following Content Security Policy directive: “img-src http: https:”.

Is there any way to change the Content Security Policy that is set in the head/meta tag of the rendered html file?

This directive (img-src http: https:) needs to be this (img-src * data:) to display the base64 string image in the Handlebars template like this:

<img src='data:image/JPG,base64stringgoeshere'/>

Thanks

1 Like

I would love to see this too. I’ve tried setting via javascript and I’ve tried removing the meta tag which sets the policy with javascript to no avail. Would be nice if the meta tag was gone altogether or at least has the “img-src * data:” setting as mentioned above.

Hi @ddMypostman @rforb, I don’t see any reason why we cannot allow this. If we don’t find any grave security concerns from our security team, we would enable this in the subsequent app release.

@rforb The meta tags are like the necessary evils which have been added for security reasons. If not set properly any 3rd part library you load from CDN has the potential to read any file on your system.

3 Likes

@s-a-g-e Does the modification/removal of the Content Security Policy meta tag need to be a new feature request?

The meta tags are like the necessary evils which have been added for security reasons. If not set properly any 3rd part library you load from CDN has the potential to read any file on your system.

Oh wow I didn’t know this was the case. I assumed the browser should protect against any script regardless of SCP from breaking out of its sandbox.

@ddMypostman the CSP meta tags cannot be removed because of the security implications. But the feature request for allowing data-uri is under security review now and if it gets accepted will be out soon.

@rforb The visualizer uses nested web-view internally and as such do not provide any security unless configured with proper CSP.

I second this.

I’m trying to display a Base64-encoded image from the response but the CSP is stopping me from doing so.

Would love to see this being added soon.

@ddMypostman @rforb @quanganhdo We are rolling out v7.11.0 which allows usage of data URIs for images in Visualizer. Once you get the update, can you retry your visualizer scripts, and let us know if it works now?

Wow thanks guys! Works beautifully! 5 out of 5 stars for efficiency! :partying_face:

1 Like