Cordova ionic app not working on Android 9 && 10

Question

My ionic application not working on android 9 devices, works perfectly fine on android device with version less than 9. Application doesn't connect to backend upon loading the landing page. Any ideas ?

Environment I am using : Ionic:

ionic (Ionic CLI) : ^5.0.0 Angular ^7.2.2

Cordova:

cordova (Cordova CLI) : 8.0.0 Cordova Platforms : android 8.0.0

System:

Android SDK Tools : 29 NodeJS : v10 npm : 6.2.0

Answer 1

Reason

This is due to this policy starting in Android 9 : https://developer.android.com/training/articles/security-config.html#CleartextTrafficPermitted

Applications intending to connect to destinations using only secure connections can opt-out of supporting cleartext (using the unencrypted HTTP protocol instead of HTTPS) to those destinations.

Note: The guidance in this section applies only to apps that target Android 8.1 (API level 27) or lower. Starting with Android 9 (API level 28), cleartext support is disabled by default.

Cleartext (HTTP traffic) is now disabled by default, so it amounts to having something like this

<domain-config cleartextTrafficPermitted="false">
  <domain includeSubdomains="true">*</domain>
</domain-config>

Solution

Replace all http calls with https URLs.

Or...

Force HTTP (not secure)

If you really need to allow HTTP traffic for some requests, you can do so by adding some config in your Android Manifest, or create a plugin to update the manifest every time you rebuild the app from scratch.

You need to add an attribute to the <application> tag in the manifest, so to not overwrite everything, you need to use the <edit-config> tag with mode="merge" (see: https://cordova.apache.org/docs/en/latest/plugin_ref/spec.html#edit-config )

HTTP is not considered a secure protocol, and every request sent (and its payload) can be read by an attacker, so be careful

plugin.xml

<?xml version="1.0" encoding="UTF-8"?>
<plugin xmlns="http://apache.org/cordova/ns/plugins/1.0"
        xmlns:android="http://schemas.android.com/apk/res/android"
        id="phonegap-plugin-old-http-support-android" version="0.0.1">
    <name>OldHttpSupportPlugin</name>

    <description>Force HTTP for Android 9+</description>
    <license>MIT</license>

    <keywords>cordova,android,http</keywords>
  
    <engines>
        <engine name="cordova" version=">=6.0.0"/>
        <engine name="cordova-android" version=">=7.0.0"/>
    </engines>
  

    <platform name="android">
        <config-file target="res/xml/config.xml" parent="/*">
            <feature name="OldHttpSupportPlugin">
                <param name="android-package" value="YOUR.PACKAGE.plugin.OldHttpSupportPlugin"/>
            </feature>
        </config-file>


        <!-- Source file for Android -->
        <source-file src="src/android/network_security_config.xml" target-dir="res/xml/" />

        <edit-config file="AndroidManifest.xml" target="/manifest/application" mode="merge">
            <application android:networkSecurityConfig="@xml/network_security_config" />
        </edit-config>
    </platform>
</plugin>

network_security_config.xml

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <domain-config cleartextTrafficPermitted="true">
        <domain includeSubdomains="true">my.domain.com</domain>
        <domain includeSubdomains="true">example.org</domain>
        <domain includeSubdomains="true">111.222.333.444</domain>
    </domain-config>
</network-security-config>

Answer 2

You can add in config.xml inside android platform section the following:

<edit-config file="AndroidManifest.xml" mode="merge" target="/manifest/application">
        <application android:usesCleartextTraffic="true" />
</edit-config>

Final result:

<platform name="android">
...
<edit-config file="AndroidManifest.xml" mode="merge" target="/manifest/application">
    <application android:usesCleartextTraffic="true" />
</edit-config>
...
</platform>

Answer 3

I had this problem with Ionic 3 and Cordova Android 9.0

I solved it by putting these lines in config.xml file. My solution was a little bit different than @Emilio's Ferrer solution

First you need to add xmlns:android="http://schemas.android.com/apk/res/android" in the <widget> target on the file begining. Without this setting, you won't be able to build your app.

Your <widget> target will look like this.

<widget id="your.id" version="x.x.x" xmlns="http://www.w3.org/ns/widgets" xmlns:android="http://schemas.android.com/apk/res/android" xmlns:cdv="http://cordova.apache.org/ns/1.0">

Then add this inside the <platform name="android" tag

<edit-config src="platforms/android/app/src/main/AndroidManifest.xml" target="AndroidManifest.xml">
        <application android:usesCleartextTraffic="true" />
</edit-config>

Note that this is a workaround to allow requests over HTTP, and of course it is recommended that you make requests only to addresses under SSL certificate.