Roxx
Roxx

Reputation: 3986

remote image not loading in cordova

i have whitelisted the url also added <access origin="*" /> in config.xml but image are not showing in the hybrid app. It is showing in the browser but not showing in app.

I searched everywhere and tried everything as mentioned but it is not working. However, local images are showing fine.

<img width="35" height="30" id="profile-pics" class="profile img-circle" name="profile-pics" src="http://www.example.com/img/53_20160713104002.png">

config.xml

<access origin="*" />
    <allow-intent href="http://*/*" />
    <allow-navigation href="http://www.test.com/*" />
    <allow-navigation href="http://www.example.com/*" />
    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />
    <platform name="android">
        <allow-intent href="market:*" />
    </platform>

Upvotes: 2

Views: 8255

Answers (2)

tech-e
tech-e

Reputation: 462

I had the exact issue but even when adding the meta tag to the head the images would not load due to a CORS dom error 18. I found this link https://github.com/niklasvh/html2canvas/pull/374 that lead me to try adding a string to the end of the image source to prevent caching of the image and it worked!

var src = 'https://example.com/images/test.jpg'; 
img.src = src  + this.createRequestString() + "?request=" + (new Date().getTime()) + (Math.random() * 50000); 

Upvotes: -1

Roxx
Roxx

Reputation: 3986

<meta http-equiv="Content-Security-Policy" content="default-src *; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'; media-src *; img-src * filesystem: data:">

It fixed the issue. Just added in the head section.

Upvotes: 11

Related Questions