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}}
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.
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
Related
tl;dr
Essentially i need to set COOP/COEP headers to enable SharedArrayBuffer functionality in my Capacitor v3 iOS App and running a ServiceWorker to set the headers is the only solution i have found so far.
Background to the problem
Both Chrome Android and Safari iOS now support SharedArrayBuffer
which now means Ffmpeg.wasm can utilise multi-threading. SharedArrayBuffer requires a secure context to enable functionality, this is done by setting the following headers;
Cross-Origin-Embedder-Policy: require-corp
Cross-Origin-Opener-Policy: same-origin
Further requirements;
The site needs to be served over HTTPS or localhost
The headers have to be set server side (headers cannot be set using meta http-equiv=".." in the head tag)
I've found this problematic in Capacitor to implement. My App is self contained (App files served locally), it doesn't require external http requests to serve the App files. This means setting the required headers server-side isn't an option.
The Work-around solution
The following solution suggests using a ServiceWorker to set the COOP/COEP headers client-side, which is exactly what i need. Enabling COOP/COEP without touching the server
The Problem
ServiceWorkers have their own set of requirements and this is where i'm stuck.
To enable this ServiceWorker API on iOS i'm using App-Bound Domains.
The following issue in github Support deploying a PWA with capacitor as native app outlines the steps required to implement App-Bound Domains in Capacitor.
Which include;
Adding a list of your domains incl. server.hostname / localhost to Info.plist.
Enabling limitsNavigationsToAppBoundDomains in your src - capacitor/capacitor.config.json
After setting App-Bound Domains i can the following error;
serviceWorker.register() must be called with a script URL whose protocol is either HTTP or HTTPS
This happens because Capacitor apps are served from capacitor:// in iOS.
Is there anyway around this? ( that does not require serving from a remote url).
Or has anyone discovered a better approach to setting COOP/COEP headers client-side in Capacitor?
Thanks Cam
We have an Ionic 4 (Cordova/Angular) app that makes requests to a REST API backend with HttpClient, using cookies for authentication.
The app runs fine on Android (which apparently proves that we've configured CORS correctly). We are now in the process of adapting it for iOS. We have found that when the Safari setting "prevent cross-site tracking" is turned on (which it is by default), WkWebView ignores the Set-Cookie header that is sent by the backend in response to a successful login request, causing all subsequent requests to fail.
Is there a way to avoid the problem without requiring all users to turn off this setting (which is definitely not an option)? We have considered switching to JWT authentication, but I'm afraid that it won't solve the problem, as our backend expects JSON, and according to the docs, "Content-Type: application/json" headers also cause the request to be considered as a CORS request.
Additionaly, we have come across another problem which seems to be related. The app won't run on the iOS simulator on macOS - the Set-Cookie headers are ignored, even if we switch the above setting off! Meaning we can debug the app only on a physical device, which is quite a hindrance.
After several hours of searching on the web, and not finding any similar complaints, I have the feeling that I'm missing something obvious.
This library has come to my rescue: ionic-native-http-connection-backend
Quoting from the docs:
This library adds #ionic-native/http (when available) as a connection backend to Angular's Http and HttpClient
Motivation
Now that Apple promotes/requires the use of WKWebView instead of the deprecated UIWebView, Ionic has switched newly created apps over via their cordova-plugin-ionic-webview (and Cordova offers it via their cordova-plugin-wkwebview-engine). That causes requests that used to work just fine to fail with CORS errors.
The real solution of course is to fix the CORS issues server side - but this may not be possible with e.g. 3rd party APIs.
Even though there is a way to solve CORS issues without changing server's response header by using #ionic-native/http, this only works on device and doesn't provide all the power of Angular's Http and HttpClient.
How it works
The library provides a HttpBackend interface for Angular's HttpClient
This HttpBackend interface tries to use #ionic-native/http whenever it is possible (= on device with installed plugin)
If HttpBackend finds it impossible to use #ionic-native/http, it falls back to standard Angular code (HttpXhrBackend, which uses XmlHttpRequest)
This strategy allows developers to use Angular's HttpClient transparently in both environments: Browser and Device.
Although I still find it strange, that the developer only mentions the library's intended use for situations where CORS can't be configured server-side, but not the 2 problems that it solves for me, namely 1) having to require all users to allow cross-site tracking, and 2) not being able to use the simulator.
I've had a website running on Azure now for a while, and I've not had any problems until today when I discovered that browsing to it via a mobile device (tested on Android (Chrome/Firefox) and Apple (iPhone 6 - Safari) ) I get a:
You do not have permission to view this directory or page
error. I've not changed anything on the site, the last publish was 5 days ago, and it was working then. Both my staging and prod environments have gone down like this.
It looks like it's returning a 403, but I can't see why.
The site is an ASP.NET MVC5 site, running as an Azure Web App.
Update
OK, I've now run up a test version of the site with the [RequireHttps] attribute removed from the controllers - now I can navigate to the pages by just http, but https gives me the permission error.
I've managed to solve the problem, in my web.config I had a URL rewrite to prevent SSL3.0 access (based on this post: Disabling SSL3 in in Azure websites).
After switching on the logs in Azure and loading the pages up I saw the 403 error with the message
SSLv3 connections are forbidden by this site
in it. This came from the url rewrite.
My PC was happy loading as I have BitDefender and that was injecting it's own SSL cert into place over the one supplied by my site. Turning off SSL Scanning in BitDefender gave me the error on all browsers.
So the solution so far is to remove the SSL3 rewrite and look into another way to achieve the same thing.
The corporate network which I am using is having "proxy" set up to connect to internet. I made the necessary changes in Network settings in mac and I am able to see websites loading in Safari (I have entered the credentials and saved in KeyChain also), but when I try to access the sites via iOS simulator, the connection fails and asks for authentication but the problem is that no pop-up is being shown so that I can enter the username and pwd. I have seen the pop-ups in iOS6 simulator and it used to work. I would like to know whether I need to do some changes specifically to iOS simulator to get this working?
I tried turning on Settings -> Developer -> Allow HTTP services, this works when you are in an open network (home), but in corporate network auth error is being show in a plain html page and there is no pop-up to enter credentials. I also tried restarting the simulator none of this fixed the issue .
Below is the error
Error Code :407 Proxy Authentication Required. Forefront TMG requires authorization to fulfill the request. Access to the Web Proxy filter is denied. (12209).
Thanks in advance
-anoop
This is mentioned as a known issue in the Xcode 6.1 Release Notes:
iOS Simulator does not support the use of network proxy servers that
require authentication. (14889876)
I have a very simple Worklight project that has two adapters. The first is talking to LinkedIn OAuth services to return an access token. The second takes the access token and calls LinkedIn's API services. The code works beautifully in project A. Project A is a larger project and includes a bunch of other things. I took the working adapters and copied them into project B. The adapters are word for word the same. The security settings between the projects are identical. Both adapters are deployed and I can verify them on the Worklight Console. However, in project B, when i call the oauth adapter i get the access token just fine, when i turn around and call the api adapter I get an error immediately saying that the host is unresponsive. UNRESPONSE_HOST "The service is currently not available".
Here is the logcat messages:
01-16 15:42:44.298: D/LinkedIn(3101): Request [http://192.168.245.1:10080/LinkedInDevWorks/apps/services/api/LinkedIn/android/query]
01-16 15:42:44.488: E/LinkedIn(3101): [http://192.168.245.1:10080/LinkedInDevWorks/apps/services/api/LinkedIn/android/query] Host is not responsive. Try to manually access the URL through the android emulator browser to verify connectivity.
I'm running out of ideas...
I looked at this article: http://www.ibm.com/developerworks/websphere/techjournal/1212_paris/1212_paris.html on adapter error messages but the settings between the two projects are identical so it's odd that it works on one and not the other.
I am running worklight 6.0
I still haven't found a solution to this problem but I wanted to post the workaround as an answer for others facing a similar problem:
"When i call the second adapter within the success handler from the first adapter or from within the wlCommonInit() method it does NOT throw the UNRESPONSIVE_HOST error."