13

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.

Keval
  • 3,389
  • 2
  • 24
  • 41
Brieuc
  • 3,994
  • 9
  • 37
  • 70
  • 1
    See if this answer helps you: http://stackoverflow.com/a/29916802/4412363 – Keval May 19 '15 at 13:01
  • Thank you i'll try that now and get back to you. – Brieuc May 19 '15 at 13:05
  • Okay that is working! Well is you want to write an answer linking to this post i'll be glad to validate it. – Brieuc May 19 '15 at 13:21
  • It actually is a duplicate, but your question is more specific in nature, which will lead people to it when they search on this issue, so I will add the answer as `Community Wiki`. – Keval May 19 '15 at 13:30
  • Yea this is why it was pretty hard to find the answer with the keywords i was looking for. Thank you. – Brieuc May 19 '15 at 13:35
  • 1
    For me with cordova 6.3.0, I have to modify `` of .html file that make a network request. As follow, ``. I add `*` after `'self'` then it works. Or better to be specific, but I have to specifically specify protocol too i.e. `https://yourdomain.com` and replace that `*`. – haxpor Sep 27 '16 at 09:20

5 Answers5

30

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.

Ogglas
  • 62,132
  • 37
  • 328
  • 418
Keval
  • 3,389
  • 2
  • 24
  • 41
  • 1
    isn't this opening up the security a bit too much? why do I have to enable `unsafe-inline` and `unsafe-evals` ? – Erik Dec 13 '15 at 04:19
  • I have modified my answer - we can also add ``, which was recommended in the documentation. – Keval Dec 13 '15 at 14:50
  • 1
    remove cordova-plugin-whitelist and add back the whitelist solved my problems without any code change... and the whitelist is the same version..... omg.... – Fxster Nov 30 '16 at 13:56
  • none of the above worked for me, then I found out the issue is with http apis (https apis are working), any idea? https://stackoverflow.com/questions/58384888/http-returns-null-data-status-1-only-on-android-when-sending-http-requests – Reza Oct 14 '19 at 23:08
  • Doesn't seems to be working anymore on the Android SDK 30. Does somebody have the same issue & had an answer to it ? – Raphaël Balet Apr 26 '22 at 08:16
5

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';">
Abhishek
  • 106
  • 1
  • 5
0

I faced the same issue with ionic app. In my case, the android app was running fine on my mobile but it was not making the http calls on other team members mobile.

After debugging the device using chrome://inspect#devices. I came to know the exact error. During the HTTP call, the app was giving ERR_CLEARTEXT_NOT_PERMITTED error.

I used below link to allow sending the data in clear text format in AndroidManifest.xml file in my playpen. https://forum.ionicframework.com/t/err-cleartext-not-permitted-in-debug-app-on-android/164101

Pankaj Shinde
  • 107
  • 1
  • 5
0

If you are sending http request to a non https url, Then Make sure you have added

android:usesCleartextTraffic="true"

in AndroidManifest.xml 

<?xml version="1.0" encoding="utf-8"?>
<manifest ...>
    <uses-permission android:name="android.permission.INTERNET" />
    <application
        ...
        android:usesCleartextTraffic="true"
        ...>
        ...
    </application>
</manifest>

For alternative options check this answer

Arun Raj
  • 253
  • 2
  • 11
0

This is a network security related issue. To fix this, replace resource/android/xml/network_security_config.xml

With,

<?xml version="1.0" encoding="utf-8" ?>
<network-security-config>
    <base-config cleartextTrafficPermitted="true">
        <trust-anchors>
            <certificates src="system" />
        </trust-anchors>
    </base-config>
    <domain-config cleartextTrafficPermitted="true">
        <domain>api.mydomain.in</domain>
    </domain-config>
</network-security-config>
Thilina Koggalage
  • 1,044
  • 8
  • 16