Browsers do not randomly request resources
My site contains code to log JavaScript errors to the web server (Apache) as they occur, using the $ exceptionHandler combination in AngularJS for exceptions in my Angular code, and also through window.onerror for things happening outside Angular.
Several bugs reported lately indicate that clients do not seem to be accidentally able to request one resource or the other. Until now, I could not find any correlation between the specific resource that was not selected, or the browser or client device showing the problem.
As an example, one of the JavaScript resources in my pages is called "utility.js". This includes some global functionality and other general website stuff. An iPhone user (on iOS 10.3.2) loaded a page today and fetched all resources for that page except utility.js (I looked at the Apache access log for the session and could see all other resources listed on the requested page) and in the correct order - but not utility.js, and there was nothing in the error log on the same timeframe). A second later, a JavaScript error was logged to our server from the phone because the global function defined in the .js utility is not defined.
Another (more common) example is the AngularJS example which generates a $ compile: tpload error when trying to access an HTML template resource. I receive several of them every day. The pattern in question varies between error instances, but in the cases I've looked at, again there is no data in the Apache log of the template resource request. Other template resources for the same page were loaded successfully. Note that in this case, I sometimes see the same client log with an error regarding the same resource multiple times over the course of several minutes, assuming the user is reloading the page and getting the same issue, so it seems like something is "stuck" or blocking in the browser, but I just can't imagine what.
I am sure that these resources are not cached in the users' browsers already as in the cases in which I looked, other resources were requested on the page, which would not have been if the page had already been loaded.
I really don't know where to go with this problem at this time. As far as I know, there is no way for me to get the visibility of browser network traffic for my page.
Any suggestions for further diagnosing this problem?
source to share
It looks like this is the reason (at least a significant part) of the $ compile: tpload errors, if not possible, and some others:
https://github.com/angular/angular.js/issues/14219
Basically, it seems that Chrome and Firefox do not correctly (?) Generate error events for XHR requests that are aborted due to page unloading (i.e. reloading or navigation). In my case, clients must have in-flight requests for angular templates that get aborted when they are reloaded or deleted ... maybe they are on a slow network connection and have problems loading the page and are therefore trying to reload.
I reproduced the error by inserting a PHP sleep () request in one of the templates to prevent Apache from responding immediately. If I load the page then reload it or navigate, compile log error: tpload is logged accordingly. I also found that Apache only logs requests in the access log file after they are answered, which at least explains the behavior I observed there (although not completely!)
It doesn't explain the cases of the error occurring for IE11, although I couldn't reproduce it with that. Also does not explain why the vast majority of incidents are on Android devices.
Overall some progress, but I don't have all the answers yet. At least it might be helpful for someone out there!
source to share