We were faced with a very similar problem and it was a pain to figure it out. For those unlucky souls who will have to deal with this, here is what we did:
The ionic app was working fine in the browser (Chrome, and Firefox), was deployed to Apple’s App store, and was communicating fine with our API on AWS. Then we went for the Android build. In the emulator, our https API request would not even get sent out. On a physical device, https requests would not get sent out either (after deploying to “internal testing” on Google Play)
Ran our app in the emulator
Opened chrome, typed “chrome://inspect”, waited, clicked link to emulator instance, and was able to look at the network tab. The requests would quickly cycle from (pending) to (cancelled), without being sent out to the server.
- Looked all over stackoverflow and the main advice was to disable https, which is a terrible idea.
- The other common advice is to use native http, but what’s the point of using ionic if we have to have 2 code bases, and I wanted to keep my http interceptors.
- Added a network_security_config.xml file (which is probably not strictly necessary, but it removes a compilation warning)
- Checked the SSL certificate on our servers by clicking on the lock icon in a browser. Looked fine. (perhaps because it really wasn’t, but I there was a manual override that I had added long ago and forgotten about).
- lots of other tail-chasing…
- Finally used sslshopper’s tool to verify our SSL cert:
SSL Checker
Turns out that while our cert was ok, the chain of certs was not. This will show up as a red broken arrow in their diagnostics.
Basically, you have to take your SSL cert and create a bundle, by appending the SSL certs of the organization that provided your cert, and appending any other SSL certs that certify the certifier, until the whole chain is clean. We had used a provided bundle, but it was not going sufficiently up through the chain.
Fix the SSL chain:
cat your-purchased-cert-site-com.crt > your-site.bundle.crt
cat other-org-cert-sectigoRSA-bla-bla-bla.crt >> your-site.bundle.crt
cat another-org-cert-USERTrust-bla-bla-bla.crt >> your-site.bundle.crt
cat some-final-high-level-org-cert.crt >> your-site.bundle.crt
Then, in our case, for nginx on ubuntu:
put your-site.bundle.crt where it can be used. (in our case, /var/ssl)
update /etc/nginx/sites-available/site-name.conf:
ssl_certificate /var/ssl/your-site.bundle.crt
ssl_certificate /var/ssl/your-private-key.key
and restart your web server (in our case nginx: sudo systemctl restart nginx)
check it with sslshopper’s checker, you should see green arrows all the way.
started our emulator, and the API calls went right through.