Ionic android app can't communicate with Express backend

I am trying to build my perfectly working ionic web app to android. The app launches, but can't communicate with my Express backend. I get this error :

Msg: Mixed Content: The page at 'https://localhost/login' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://{{ip}}:3000/getGroupsNameOfUser'. This request has been blocked; the content must be served over HTTPS.(with getGroupsNameOfUser being a app.post() of my express server, and {{ip}} the local ip of the computer runing express that I prefer not to share just in case).

I understand that my android app is in https and doesn't like to communicate with a server in http.

To solve this, I have tried enabling mixed content by adding this line in AndroidManifest.xml:android:usesCleartextTraffic="true" but it just doesn't work (I still get the same error).

I have then tried by adding a network_security_config.xml in res/xml/, filled with :

<network-security-config><domain-config cleartextTrafficPermitted="true"><domain includeSubdomains="true">http://192.168.1.15:3000</domain><domain includeSubdomains="true">http://127.0.0.1:3000</domain></domain-config></network-security-config>

And adding this line in AndroidManifest.xml : android:networkSecurityConfig="@xml/network_security_config" but it doesn't work either...

I have then tried the recommended solution: putting my express server on ssl. I created self-signed keys with this command : sudo openssl req -x509 -nodes -days 365 -newkey rsa:2048 -keyout ./selfsigned.key -out selfsigned.crt. I had an error when using them so I used a command I found online : sudo chmod 755 selfsigned.key.

I then wrote my main js script:

const options = {  key: fs.readFileSync('keys/selfsigned.key'),  cert: fs.readFileSync('keys/selfsigned.crt')};const app = express ();app.use(bodyParser.json());app.use(cors({origin: true, credentials: true}));app.use(cookieParser());... (multiple app.post(...))https.createServer(options, app).listen(3000, () => {  console.log('HTTPS server listening on port 3000');});

Finally I changed the adress used in my ionic app with HttpClient to "https://{{ip}}:3000/".

But it still doesn't work. I get this error :

[ERROR:ssl_client_socket_impl.cc(879)] handshake failed; returned -1, SSL error code 1, net_error -2022024-05-25 12:08:30.335 22173-22173 Capacitor/Console       io.ionic.starter                     E  File: https://localhost/main.262cd90795cda89d.js - Line 1 - Msg: ERROR [object Object]2024-05-25 12:08:31.178  1588-2373  VerityUtils             system_server                        E  Failed to measure fs-verity, errno 1: /data/app/~~DnQFZdmZ2tBOfRYWJyZ4Rw==/io.ionic.starter-bZlHBiUj6Wi4udiAfuiCCA==/base.apk2024-05-25 12:08:31.306  1588-2373  VerityUtils             system_server                        E  Failed to measure fs-verity, errno 1: /data/app/~~DnQFZdmZ2tBOfRYWJyZ4Rw==/io.ionic.starter-bZlHBiUj6Wi4udiAfuiCCA==/base.apk

I don't understand if the issue is from my backend or my app. I have tried "converting" my key to der with this command : openssl x509 -outform der -in selfsigned.crt -out server.der and adding the file to my phone's trusted certificates. But it still doesn't do anything.

Since I can do post requests with postman on https://localhost:3000, I suppose that my express works correctly, at least locally. I have tried with postman on another computer, and it works to if I disable ssl verification. If I try with the webapp (launch with ionic serve --ssl), I get a cors error that I can't manage to solve, but I won't care as long as my android app works, which it still does not T.T.

I am completely desperate, I don't know what else to try. Can anyone help me ?