Android Virtual Device error: This request has been blocked; the content must be served over HTTPS

I am simply trying to make a Capacitor (Angular) HTTP GET Request from the Android Virtual Device (API 29) to an API (.NET 6.0) also running on my PC.

In production I would change the API to only use HTTPS but for development I wanted HTTP as I wouldn't expect the AVD to accept the self-signed certificate.

The error I see is simply

 was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://10.0.2.2:5409/FromMobile/test'. This request has been blocked; the content must be served over HTTPS.

I assume this is an issue mainly because Capacitor is serving via HTTPS but the call is to a non-secured HTTP api.

I tried with my IP address too but had the same error.

I have already added

android:usesCleartextTraffic="true"

to the manifest.xml file.

I also tried adding the network_security_config.xml

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

and

android:networkSecurityConfig="@xml/network_security_config"

But no change

UPDATE: I have also tried installing the certificate on to the phone but this had made no difference

from Android Virtual Device error: This request has been blocked; the content must be served over HTTPS