Browser failed to load resource with deep levels of folders

I have encountered a strange problem.

Here is the screenshot from the inspector tools.

The browser failed to load some resources even though the resources do exist. When I open the URL from another tab, the resource is successfully loaded.

URL in image:

• http://angular.local/app/js/controllers/advertise/cm_code/list.js
• http://angular.local/app/js/controllers/advertise/create_new_shop/create_new_shop.js
• http://angular.local/app/js/controllers/advertise/media_settings/media_settings.js
• http://angular.local/app/js/controllers/advertise/register_cm_code/register_cm_code.js

Other resources with fewer levels of folders are loadable. Ex:

• http://angular.local/app/js/controllers/admin/change_password.js

I thought the problem is from my web server, but the problem still remained after switching between NodeJS and Apache.

Has anybody encounter similar problems and got any solutions?

You should change file location to outter level of folders.

The other way to load many files is using preload.js. You should try this.