I'm building a smart budgeting Ionic Android App, it was working smoothly when I was running the command:

ionic cap run android -l --external

But when I built the apk, suddenly the frontend is loaded over https and I'm getting this error:

polyfills-4BK4MXU4.js:1 Mixed Content: The page at 'https://localhost/tabs/stats/expenses/3' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://3.87.224.134:3000/expenses/6jHsnfpriwRm1i22DhqAVrIfP2R2/2'. This request has been blocked; the content must be served over HTTPS.

I don't know how out of a sudden my page is loaded on another protocol, I tried resolving it using:

android:usesCleartextTraffic="true"

and in capacitor.config I used :

server: {
cleartext: true

}

The two didn't have an effect on this. What's the problem? How to fix it? Where is the https coming from?

I'm building a smart budgeting Ionic Android App, it was working smoothly when I was running the command:

ionic cap run android -l --external

But when I built the apk, suddenly the frontend is loaded over https and I'm getting this error:

polyfills-4BK4MXU4.js:1 Mixed Content: The page at 'https://localhost/tabs/stats/expenses/3' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://3.87.224.134:3000/expenses/6jHsnfpriwRm1i22DhqAVrIfP2R2/2'. This request has been blocked; the content must be served over HTTPS.

I don't know how out of a sudden my page is loaded on another protocol, I tried resolving it using:

android:usesCleartextTraffic="true"

and in capacitor.config I used :

server: {
cleartext: true

}

The two didn't have an effect on this. What's the problem? How to fix it? Where is the https coming from?

• android
• ionic-framework
• apk
• mixed-content

1 Answer 1

Modern browsers and environments block HTTP requests for security reasons. Ensure that all API endpoints you are calling are served over HTTPS. Also dont fet to update your capacitor.config.json:

{
  "server": {
    "cleartext": true,
    "url": "https://0.00.000.000:3000" // or your actual server URL
  }
}