jQuery Post fails in Cordova from Android app

Question

I'm using Cordova 9.0.1:

[luis@luis myapp]$ cordova -v
9.0.0 (cordova-lib@9.0.1)

I can't get to fix this problem. Whenever I try to login from the Android app with a simple jQuery Post request to our server, it enters the fail() method. The request is not logged into the Apache access log, so it never reaches the server.

However, if I do cordova run and I try from a browser, the login is successful.

This is my config.xml file:

<?xml version='1.0' encoding='utf-8'?>
<widget id="io.cordova.experienceerp" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    <name>MyAPP</name>
    <description>
        Description
    </description>
    <author email="info@mycompany.com" href="http://mycompany.com">
        My company
    </author>
    <content src="index.html" />
    <access origin="*" />
    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />
    <platform name="android">
        <allow-intent href="market:*" />
        <icon density="ldpi" src="res/icon/android/icon-36-ldpi.png" />
        <icon density="mdpi" src="res/icon/android/icon-48-mdpi.png" />
        <icon density="hdpi" src="res/icon/android/icon-72-hdpi.png" />
        <icon density="xhdpi" src="res/icon/android/icon-96-xhdpi.png" />
        <splash density="port-hdpi" src="res/screen/android/drawable-port-hdpi-screen.png" />
        <splash density="port-ldpi" src="res/screen/android/drawable-port-ldpi-screen.png" />
        <splash density="port-mdpi" src="res/screen/android/drawable-port-mdpi-screen.png" />
        <splash density="port-xhdpi" src="res/screen/android/drawable-port-xhdpi-screen.png" />
    </platform>
    <platform name="ios">
        <allow-intent href="itms:*" />
        <allow-intent href="itms-apps:*" />
        <icon height="57" src="res/icon/ios/icon-57.png" width="57" />
        <icon height="114" src="res/icon/ios/icon-57-2x.png" width="114" />
        <icon height="72" src="res/icon/ios/icon-72.png" width="72" />
        <icon height="144" src="res/icon/ios/icon-72-2x.png" width="144" />
        <splash height="1024" src="res/screen/ios/screen-ipad-portrait.png" width="768" />
        <splash height="2048" src="res/screen/ios/screen-ipad-portrait-2x.png" width="1536" />
        <splash height="480" src="res/screen/ios/screen-iphone-portrait.png" width="320" />
        <splash height="960" src="res/screen/ios/screen-iphone-portrait-2x.png" width="640" />
        <splash height="1136" src="res/screen/ios/screen-iphone-portrait-568h-2x.png" width="640" />
    </platform>
    <preference name="Orientation" value="portrait" />
    <preference name="AutoHideSplashScreen" value="true" />
    <preference name="SplashScreenDelay" value="3000" />
    <preference name="SplashMaintainAspectRatio" value="true" />
    <preference name="SplashShowOnlyFirstTime" value="false" />
    <preference name="AndroidPersistentFileLocation" value="Compatibility" />
    <!--
    <plugin name="com.hutchind.cordova.plugins.streamingmedia" spec="~0.1.4" />
-->
    <plugin name="uk.co.workingedge.phonegap.plugin.launchnavigator" spec="^4.1.3" />
    <plugin name="cordova-plugin-camera" spec="^4.0.3" />
    <plugin name="cordova-plugin-tts" spec="^0.2.3" />
    <plugin name="cordova-plugin-badge" spec="^0.8.7" />
    <plugin name="cordova-plugin-whitelist" spec="^1.3.3" />
    <plugin name="cordova-plugin-vibration" spec="^3.1.0" />
    <plugin name="cordova-plugin-splashscreen" spec="^5.0.2" />
    <plugin name="cordova-plugin-network-information" spec="^2.0.1" />
    <plugin name="cordova-plugin-media-capture" spec="^3.0.2" />
    <plugin name="cordova-plugin-media" spec="^5.0.2" />
    <plugin name="cordova-plugin-local-notification" spec="^0.9.0-beta.2" />
    <plugin name="cordova-plugin-inappbrowser" spec="^3.0.0" />
    <plugin name="cordova-plugin-file" spec="^6.0.1" />
    <plugin name="cordova-plugin-dialogs" spec="^2.0.1" />
    <plugin name="cordova-plugin-device" spec="^2.0.2" />
    <plugin name="cordova-plugin-blob-constructor-polyfill" spec="^1.0.2" />
    <plugin name="cordova-plugin-app-event" spec="^1.2.1" />
    <plugin name="cordova-plugin-advanced-http" spec="^2.0.1" />
    <plugin name="cordova-plugin-actionsheet" spec="^2.3.3" />
    <plugin name="cordova-plugin-file-transfer" spec="^1.7.1" />
    <plugin name="cordova-plugin-geolocation" spec="^4.0.1" />
    <plugin name="cordova-plugin-mauron85-background-geolocation" spec="^3.0.0-alpha.47">
        <variable name="GOOGLE_PLAY_SERVICES_VERSION" value="11+" />
        <variable name="ANDROID_SUPPORT_LIBRARY_VERSION" value="26+" />
        <variable name="ICON" value="@mipmap/icon" />
        <variable name="SMALL_ICON" value="@mipmap/icon" />
        <variable name="ACCOUNT_NAME" value="@string/app_name" />
        <variable name="ACCOUNT_LABEL" value="@string/app_name" />
        <variable name="ACCOUNT_TYPE" value="$PACKAGE_NAME.account" />
        <variable name="CONTENT_AUTHORITY" value="$PACKAGE_NAME" />
    </plugin>
    <engine name="browser" spec="^5.0.4" />
    <engine name="ios" spec="^4.5.5" />
    <engine name="cordova-android" version=">=1.8.0" />
</widget>

As you can check, it has the tags for cross domain access:

<access origin="*" />
    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />

I even added this tag to my entry point in the app, index.html:

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

I saw this as a solution somewhere else, but it still doesn't work.

This is the piece of code which fails. No error message is displayed in the app console (I'm testing it with the device plugged to my computer so that I can check the console):

console.log('Post to ' + url + ' user:' + data.user + ' password:' + data.password); // both the URL and the data are correct
$.post(url, data, function(res) {
    // This code is not reached
    if (res.id !== undefined && res.token) {
        console.log('Login OK');
        // store user data...
        return;
    }
    if (res.error) {
        // alert the validation error
        return;
    }
    alert('Unexpected server error');
}).fail(function(jqXHR, textStatus, errorThrown) {
    console.log('Login error: ' + textStatus + ' ' + errorThrown);
    // show error in login form...
});

The error displayed in the console is: Login error: error Not Found

Could you please help me? I'm stuck and nothing else comes to mind, and I've done everything I've found.

Answer 1

I found the solution:

As of Cordova 9, API Level 28, all devices with Android 9 or later are forced to make https requests instead of http, which will always fail unless specified in an exception config, as stated here:

Security config

More info here