Network Error on iOS emulator from Capacitor App

Question

I am using Angular Capacitor v3 with axios. Receiving a Network Error when making any request to any external server. This is only occurring while emulating with XCode. The request never reaches the server, just returns immediately with status 0.

I cannot repeat this problem locally on Windows, or published website, or Android Studio emulators, or published to android device.

Not sure if I am missing a permission or configuration, but I have tried adding "Local Network Usage", "Location Always and When In Use" permissions and played around with NSAppTransportSecurity settings to the Info.plist.

I do not believe its an issue with the server since it seems like it never even reaches it. But I have a verified HTTPS certificate, hosted by Azure, with valid CORS rules.

I have also tried HttpClient with Angular, same result.

The error occurs immediately and does not give specific information but here is the message:

{"headers":{"normalizedNames":{},"lazyUpdate":null,"headers":{}},"status":0,"statusText":"Unknown Error","url":"https://jsonplaceholder.typicode.com/users/1","ok":false,"name":"HttpErrorResponse","message":"Http failure response for https://jsonplaceholder.typicode.com/users/1 : 0 Unknown Error","error":{"isTrusted":true}}

Answer 1

I am just facing same issue It was working on different domain, no hostname is different and it stopped working. So it doesn't even make a request to a server. Also same configuration works on android. just not IOS

Answer 2

After extensive research and rebuilding from scratch, I found this was a CORS related issue but specific to setup with Azure, which was my hosted server. The confusing part was that even external example calls, such as to "http://jsonplaceholder.typicode.com/users/1" still gave the same error, which wouldn't have CORS issues, as far as I understand. If anyone knows why that happens, please let me know.

This was related to the fact that in ios, the http/https schemes cannot be used, instead it uses capacitor . This scheme is not allowed in Azure App Service CORS settings, unless you allow all, but I could not because I needed to enable Access-Control-Allow-Credentials. So I had to build the CORS configuration with the capacitor scheme allowed in my C# app service code. Removing all settings from CORS in Azure App Service then allowed the settings in my C# code to be applied.