JPEG images don't render because of "unsafe:" prefix while PNG images show fine

@ccpizz wrote:

Hello,

I am displaying some JPG images from the app folder but they don't render because Ionic/Angularjs adds the unsafe: prefix. When images are converted to PNG they are displayed without any problems, and are shown both in the browser and on ios/android.

I am not sure if it has anything to do with whitelisting, since the JPG files are not external but are located inside the app folder. Just in case I added the following in my app.js:

    $compileProvider.imgSrcSanitizationWhitelist(/^\s(https|tel|ftp|file|blob|content|ms-appx|x-wmapp0|cdvfile):|data:image\//);

also just in case added:

    <meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'">

...but this did not help.

The template is located at www/templates/section1/myfile.html and accesses the image as

<img src="images/section1/some_image.jpg">

I also tried

<img ng-src="images/section1/some_image.jpg">

but this made no difference.

Manually removing the unsafe: from the generated URL displays the JPG image, so I understand the path is correct.

This is frustrating and searching the docs does not return anything about what might be causing it. I would prefer avoiding converting all the JPG files to PNG.

Would be grateful if anyone could help bring some light into this.

Thank you.

Posts: 2

Participants: 1

Read full topic