I am using Vue3 + Vite + TypeScript to build a web application. After running npm run build, the application is successfully packaged into the 'dist' folder. I then upload this folder to a Linux server and host it using Nginx. However, when accessing the website in the browser, there is a chance of encountering failures. A page refresh may resolve the issue, and it seems to occur primarily during the initial page load. I suspect that once a successful access is made, subsequent page loads use the browser's cache.
There are two types of issues observed when the page fails to load:
Quickly displaying 'This page isn't working - www.MyDomain.com is currently unable to handle this request. HTTP ERROR 502'. In this case, the 'Network' tab shows only one entry for 'www.MyDomain.com' with a status of 502 Bad Gateway.
The page remains blank with multiple entries in the 'Network' tab.
Errors occur when accessing one or more xxx.js or xxx.css files, with the same 502 Bad Gateway status. For example, if my page has a component named 'index.vue', after running 'npm run build', it generates 'Index-_8-g66I0.css' or 'index-eurAr4hJ.js'. During the initial page load, the browser may display these files in red, accompanied by a 502 Bad Gateway error.
I would like to understand where this issue might be originating and how to troubleshoot it.
Linux CentOS 7 nginx version: nginx/1.20.1 enter image description here
I'm a beginner programmer, and I haven't tried much yet. I suspect the issue might be related to network bandwidth, given my server configuration: 2 cores, 2GB RAM, and 4Mbps bandwidth.
Reference: Screenshot of F12 Network Requests in Normal Conditions "I have attached a screenshot of the F12 Developer Tools' Network tab, captured during a normal and successful page load. This reference image is provided to illustrate the expected behaviour of network requests in optimal conditions. I hope this can assist in identifying any deviations or issues observed during the intermittent HTTP 502 errors. Your insights and suggestions based on this reference would be highly valuable. Thank you." enter image description here
I'm reaching out for guidance on where to start troubleshooting and whether my suspicion about network bandwidth is valid. Any guidance or suggestions would be greatly appreciated.