404 error loading image android device

Well I’m getting a 404 error with all my images in my android device.
With ionic serve it works perfect, i have no idea why its happening, I’m using Ionic 2.

One example of my code:
<img src="http://rodrigoreal.com/uploads/summoners_war/yellow_star.jpg">

Do u guys have any idea why its happening?
Thanks

Maybe it has to do with whitelisting urls. I had the same problem accessing a webservice, it would work with ionic serve but not on the device. Take a look here: https://github.com/apache/cordova-plugin-whitelist
What I did was:

  1. ionic add cordova-plugin-whitelist
  2. add <allow-navigation href="*" /> to config.xml
  3. add <meta http-equiv="Content-Security-Policy" content="script-src * 'unsafe-inline' 'unsafe-eval'"> to the header of index.html

Hope this solves your problem.

I’m alredy using <access origin="*" /> to control which network requests (images, XHRs, etc) are allowed.
I don’t think it is the problem.
But thanks

Did you try steps #1 and #3?

I thought it was already installed, so i didint did the first step, now it is working perfect.
Really thanks for the help.

Sure thing, glad you got it working :v:

Just one detail, use ng-src instead of src.

When I try to run ionic add cordova-plugin-whitelist, I receive this error message:
Failed to find the bower component “cordova-plugin-whitelist”.
Are you sure it exists? (CLI v2.0.0-beta.15)

Your system information:

Cordova CLI: 5.4.1
Gulp version: CLI version 3.9.0
Gulp local: Local version 3.9.0
Ionic Version: 2.0.0-alpha.42
Ionic CLI Version: 2.0.0-beta.15
Ionic App Lib Version: 2.0.0-beta.8
OS: Distributor ID: Ubuntu Description: Ubuntu 15.10
Node Version: v4.0.0

How I do it now?

Thanks

@victorcarvalhosp try that:
ionic plugin add https://github.com/apache/cordova-plugin-whitelist.git

1 Like

It worked!
Thanks!!!

Hi Victor, how do you solve this problem with CORS? I’m trying access a website using http.get() but it’s return this error:

XMLHttpRequest cannot load http://localhost:8080/contratosacucar/lerContratos.java. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8100' is therefore not allowed access.

I do not know what to do, already researched in a lot forum and could not solve. Could you give me a hand?

Just with the command:

ionic plugin add https://github.com/apache/cordova-plugin-whitelist.git

worked for me…

Olá Victor,

Estou louco com isso. Pode me ajudar? Já fiz de tudo e nada funciona.
Tenho o plugin whitelist, coloquei as diretivas e e habilitei o cors no meu backend Java Spring Rest.

Estou usando IOS.

Abaixo o request que estou tentando fazer, é para a primeira autenticação oauth2. Usando o curl funciona.

Se puder dar uma luz.

obterToken() {

let response;

let url = this.BACK_END_URL + 'oauth/token';
let body = 'password=admin&username=pai&grant_type=password&scope=read%20write&client_secret=131113&client_id=clientapp';

let headers = new Headers();
headers.append('Authorization', 'Basic ' +  btoa('clientapp:131113'));
headers.append('Content-Type', 'application/x-www-form-urlencoded');

let options = new RequestOptions({ method: 'POST', headers: headers, body: body, url: url, withCredentials: true });

this.http.post(url, body, options)
  .map(res => res.json())
  .subscribe(
    data => this.saveJwt(data),
    err => this.logError(err),
    () => console.log('Authentication Complete')
  );

console.log('Resposta a oauth/token: ' + response);

return response;

}

Consegui resolver, meu problema era no backend Spring.

Abs.