Why is the error ERR_CLEARTEXT_NOT_PERMITTED with

I'm developing a new app using the Ionic-framework and I'm using the HttpClient module for API requests.

The problem is that I've read and tried to apply the solutions on:

https://medium.com/@son.rommer/fix-cleartext-traffic-error-in-android-9-pie-2f4e9e2235e6
https://forum.ionicframework.com/t/livereload-err-cleartext-not-permitted/163487
Android 8: Cleartext HTTP traffic not permitted
Why am I seeing net::ERR_CLEARTEXT_NOT_PERMITTED errors after upgrading to Cordova Android 8?
How to fix 'net::ERR_CLEARTEXT_NOT_PERMITTED' in flutter
Android Pie: WebView showing error for plain HTTP on some sites, even with usesClearTextTraffic="true"
WebView showing ERR_CLEARTEXT_NOT_PERMITTED although site is HTTPS

But my app keeps throwing this error when it does a query to the API.

Here are the details of my files:

at /, the config.xml :

    <?xml version='1.0' encoding='utf-8'?>
<widget id="com.example" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    ...
    <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"/>
            <application android:usesCleartextTraffic="true" />
        </edit-config>
        <resource-file src="resources/android/xml/network_security_config.xml" target="app/src/main/res/xml/network_security_config.xml" />
     ...
</widget>

at /resources/android/xml/, the network_security_config.xml :

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

It is not valid to use the securely encrypted protocol HTTPS. The API only admits HTTP.

Make sure you have the following in your config.xml in Ionic Project:

<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" />
            <application android:usesCleartextTraffic="true" />
        </edit-config>

Run ionic Cordova build android. It creates Android folder under Platforms
Open Android Studio and open the Android folder present in our project project-platforms-android. Leave it for few minutes so that it builds the gradle
After gradle build is finished we get some errors for including minSdVersion in manifest.xml. Now what we do is just remove <uses-sdk android:minSdkVersion="19" /> from manifest.xml.

Make sure its removed from both the locations:
1. app → manifests → AndroidManifest.xml.
2. CordovaLib → manifests → AndroidManifest.xml.
Now try to build the gradle again and now it builds successfully

Make sure you have the following in Application tag in App → manifest → Androidmanifest.xml:

<application
android:networkSecurityConfig="@xml/network_security_config"  android:usesCleartextTraffic="true" >

Open network_security_config (app → res → xml → network_security_config.xml).

Add the following code:

<?xml version="1.0" encoding="utf-8"?>
<network-security-config>
    <domain-config cleartextTrafficPermitted="true">
        <domain includeSubdomains="true">xxx.yyyy.com</domain>
    </domain-config>
</network-security-config>

Here xxx.yyyy.com is the link of your HTTP API. Make sure you don't include any Http before the URL.

Note: Now build the app using Android Studio (Build -- Build Bundle's/APK -- Build APK) and now you can use that App and it works fine in Android Pie. If you try to build app using ionic Cordova build android it overrides all these settings so make sure you use Android Studio to build the Project.

If you have any older versions of app installed, Uninstall them and give a try or else you will be left with some error: