By Brieuc


2015-05-19 12:50:23 8 Comments

Everything were going well last week and while i was running the application on device or emulating with Genymotion, all the calls to the api were working (Either returning the data or failing but at least showing something).

I was using

ionic run android

I add to update the global cordova ionic:

npm install -g cordova ionic

Since that all the $http requests are not even processing. I can't get any responses while the Api is still working fine and the CORS are perfectly set.

The only way i found is to use the option --livereload or -l :

ionic run -l android

I want to avoid using the livereload at any cost.

I started to create a project from scratch using ionic 1.0.0 and cordova lib 4.3.0.

angular.module('starter.controllers', [])

.controller('AppCtrl', function($scope, $ionicModal, $timeout, $http) {

  alert('calling api');
  // Create an anonymous access_token
  $http
      .get(domain+'/oauth/v2/token?client_id='+public_id+'&client_secret='+secret+'&grant_type=client_credentials')
      .then(function(response){
          alert(response.data.access_token);
      });
})

So while using :

ionic serve

It is correctly alerting 'calling api' then the response (An OAuth access token for that example).

But while using :

ionic run android

It is only alerting 'calling api' but doesn't seem to process the http request.

Did anyone experience something similar? I'm getting big headaches on that.

2 comments

@Abhishek 2018-04-12 05:52:47

It worked for me, when I tried the following…

In Config.xml, allow access & navigations to your domains:

<access origin="http://yourdomain1.com" />
<allow-navigation href="http://yourdomain1.com"/>

Then in index.html, add the Content-Security-Policy as below:

<meta http-equiv="Content-Security-Policy" content="default-src 'self' http://yourdomain1.com  data: gap: https://ssl.gstatic.com; style-src 'self' 'unsafe-inline';  media-src *;  script-src 'self' 'unsafe-eval' 'unsafe-inline';">

@Keval 2015-05-19 13:34:12

With the update of Cordova 4.0.0, you will face an issue of not being able to make HTTP calls to RESTful APIs and load external resources, which include other HTMLs/video/audio/images.

Whitelisting the domains using cordova-plugin-whitelist solves the issue.

remove whitelist plugin if already installed:

cordova plugin remove cordova-plugin-whitelist

Add the whitelist plugin via CLI:

cordova plugin add cordova-plugin-whitelist

and then add the following line of code to your app's config.xml which is located in your application's root directory:

Reccomended in the documentation:

<allow-navigation href="http://example.com/*" />

or:

<allow-navigation href="http://*/*" />

and

this meta tag in your index.html

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

The reason for this issue:

From Cordova 4.0.0 for Android's update:

Whitelist functionality is revamped

  • You will need to add the new cordova-plugin-whitelist plugin to continue using a whitelist

  • Setting a Content-Security-Policy (CSP) is now supported and is the recommended way to whitelist (see details in plugin readme)

  • Network requests are blocked by default without the plugin, so install this plugin even to allow all requests, and even if you are using CSP.

  • This new whitelist is enhanced to be more secure and configurable, but the Legacy whitelist behaviour is still available via a separate plugin (not recommended).

Note: while not strictly part of this release, the latest default app created by cordova-cli will include this plugin by default.

@Erik 2015-12-13 04:19:57

isn't this opening up the security a bit too much? why do I have to enable unsafe-inline and unsafe-evals ?

@Keval 2015-12-13 14:50:09

I have modified my answer - we can also add <allow-navigation href="http://example.com/*" />, which was recommended in the documentation.

@Fxster 2016-11-30 13:56:22

remove cordova-plugin-whitelist and add back the whitelist solved my problems without any code change... and the whitelist is the same version..... omg....

Related Questions

Sponsored Content

0 Answered Questions

An error occurred while running npm i (exit code 1): Ionic

2 Answered Questions

[SOLVED] CORS issues when emulating ionic app on iOS

2 Answered Questions

Making an HTTP POST call in Ionic 2 gives forbidden response

0 Answered Questions

Ionic on ios cannot make http post request

1 Answered Questions

2 Answered Questions

ionic http request not working in emulators and devices

1 Answered Questions

[SOLVED] Error 405 when running ionic on emulator with -l -c

2 Answered Questions

0 Answered Questions

0 Answered Questions

Node oauth2 server and client credentials in client side

Sponsored Content