When using Nginx as a reverse proxy for a Vue UI default link on a Linux server, the page is blank, and you need to specify --host 0.0.0.0

[setube]

Version

5.0.8

Environment info

  System:
    OS: Linux 4.19 Debian GNU/Linux 10 (buster) 10 (buster)
    CPU: (2) x64 Intel(R) Xeon(R) Platinum 8269CY CPU @ 2.50GHz
  Binaries:
    Node: 20.11.1 - /www/server/nodejs/v20.11.1/bin/node
    Yarn: 1.22.22 - /www/server/nodejs/v20.11.1/bin/yarn
    npm: 10.8.1 - /www/server/nodejs/v20.11.1/bin/npm
  Browsers:
    Chrome: Not Found
  npmGlobalPackages:
    @vue/cli: 5.0.8

Steps to reproduce

1. Run the following command on the Linux server to start Vue UI: vue ui

2. Configure Nginx to set up a reverse proxy, mapping http://localhost:8000 to an externally accessible link.

3. Access the proxied URL in your browser (e.g., http://your-server-ip:8000).

4. The page remains blank and fails to load properly.

5. If you start Vue UI with the following command: vue ui --host 0.0.0.0

6. Then, access http://0.0.0.0:8000 via the Nginx reverse proxy, and the page displays correctly.

What is expected?

It is expected that when opening the Vue UI interface via Nginx reverse proxy, the UI content would load and display correctly without needing to use the --host 0.0.0.0 parameter.

What is actually happening?

In reality, after opening the default link (http://localhost:8000) through Nginx reverse proxy, the page remains blank and stays in a loading state. Only when I use vue ui --host 0.0.0.0 am I able to access the interface properly.