Ionic app not getting data from remote API on Android device

Issue

So i'm building an Ionic App with API calls, everything works fine when i run it on the browser and i get all my data.

But when i build the app (ionic cordova build android) and install the .apk in my phone, i get NO data, the view is just empty and i don't know why.

I followed instructions that i found here but still nothing.

I even installed "android-permissions" cordova plugin as explained in this question but when i'm installling the app one my phone, it says that the app does not require any permission.

I'm lost and don't really know why it is not working. Help neede please !.

Information about the project

Created using "ionic start appName blank --type=angular"

Ionic Framework :

@ionic/angular 4.9.1

Ionic CLI :

5.4.1

Cordova CLI :

9.0.0

Cordova Platforms : 

android 8.1.0

Thank you

Solution

This could be a whitelisting or, if you have Android 9 and your API does not use TLS, a network security issue.

Whitelisting

Add the tag <access origin="https://your-server.com" /> to your config.xml.

Network Security

To allow Android 9 devices to access http:// (non-TLS) APIs, additional configuration is required. In a Cordova app, perform the following steps:

1. Create a file called network_security_config.xml in your project root containing the following:

    <?xml version="1.0" encoding="utf-8"?>
      <network-security-config>
        <domain-config cleartextTrafficPermitted="false">
      </domain-config>
    </network-security-config>

2. Add this to your config.xml to include the new configuration in your Android Manifest:

    <platform name="android">
        ...
        <edit-config file="app/src/main/AndroidManifest.xml" mode="merge" target="/manifest/application" xmlns:android="http://schemas.android.com/apk/res/android">
            <application android:networkSecurityConfig="@xml/network_security_config" />
        </edit-config>
        <resource-file src="network_security_config.xml" target="app/src/main/res/xml/network_security_config.xml" />
        ...
    </platform>

Rebuild the Android platform (i.e. ionic cordova platform rm android and ionic cordova platform add android etc.) and it should work from your device.

Answered By - Alex Steinberg