Ionic 5/capacitor Err_cleartext_not_permitted In Android

I'm using Capacitor for building the Ionic app. These are the following commands run in order to open the android app in Android Studio. npx cap add android ionic build npx cap cop

Solution 1:

Add this to you AndroidManifest.xml in the application element

<application
    android:usesCleartextTraffic="true"

Solution 2:

When you specify the server in your Capacitor config, you should set server.cleartext to true to prevent this issue from happening. Example:

{"appId":"com.abc","appName":"abc","npmClient":"npm","server":{"url":"http://192.168.1.208:8100","cleartext":true}}

This is not very well documented - the only place I found this configuration being used was on https://capacitorjs.com/docs/guides/live-reload

Solution 3:

This post helped me find the solution to my problem.

I removed the field server in the capacitor.config.json file to make it work.

"server":{"url":"http://localhost:8100"}

Now my capacitor.config.json looks like

{"appId":"com.abc","appName":"abc","bundledWebRuntime":false,"npmClient":"npm","webDir":"www","cordova":{"preferences":{"ScrollEnabled":"false","android-minSdkVersion":"19","BackupWebStorage":"none","SplashMaintainAspectRatio":"true","FadeSplashScreenDuration":"0","SplashShowOnlyFirstTime":"false","SplashScreen":"none","SplashScreenDelay":"0"}}}

Solution 4:

You can allow cleartext traffic in the Web View by enabling it on the capacitor.config file, by adding the below code

server: {
  cleartext:true
}

Build your project to see the changes

ionic capacitor build android

Solution 5:

Add this code into capacitor.config: server: { cleartext: true }