Hey everyone,
I'm currently developing an app using Ionic, which is based on AngularJS. During my testing phase, I decided to connect my device to a very slow wifi network in order to see how the app performs under such conditions. The results were pretty bad, but fortunately, the issue seems to be quite localized.
Initially, the app wouldn't load at all. I kept seeing
Channel not fired: onDOMContentLoadedApplication Error - The connection to the server was unsuccessful. (file:///android_asset/www/index.html)After following the suggestion mentioned here: increase loadUrlTimeoutValue, the app stopped crashing. However, it would just get stuck on a white screen until the only HTTP call present in the index.html failed:
http://maps.googleapis.com/maps/api/js?key=myKey&libraries=places
The console showed
Failed to load resource: net::ERR_TIMED_OUT408 (Request Time-out) errors after a prolonged loading time, like this one:
GET http://res.cloudinary.com/myimage.jpg 408 (Request Time-out)
So, my theory is that on this extremely slow wifi connection, all HTTP calls encounter difficulties and simply fail after a certain period, leading to error messages that are visible in the console.
My main question is: how can I globally catch this type of error in order to display a message to the user? Even better, is there a way to listen for any HTTP calls and then timeout manually after around 5 seconds to show the required message?
Thanks in advance!