Nginx 與 Angular 和 Spring 啟動

Question

我是這個領域的新手，並嘗試“發布”我自己的后端+前端。

我租了一個帶有 Ubuntu 20.04 的 Linux V-Server 並安裝了 Nginx“nginx/1.18.0 (Ubuntu)”。

Angular（版本 13）-前端文件從 dist 文件夾（在 ng 構建之后）復制到服務器上的目標。 我只復制了文件，我沒有在服務器上安裝 angular，因為 angular-documentation 表明這樣就足夠了，這可能是個問題嗎？

就像 /home/FrontEnd (AngularFiles)+ /home/Backend (Springboot.jar)

Springboot-Backend（2.6.2 版）是一個監聽端口 8080 的“胖 JAR”。安裝了 Java 並配置了主變量（如果我使用

curl -I 127.0.0.1/api/EXAMPLE

我得到了預期的響應）我還嘗試了“localhost”而不是“127.0.0.1”。

不幸的是，由於 CORS，我無法從前端調用后端函數。

這是我的 NginX 配置文件：

user www-data;
worker_processes auto;
pid /run/nginx.pid;
include /etc/nginx/modules-enabled/*.conf;

events 
{
     worker_connections 768;
     # multi_accept on;
}

http 
{
include    /etc/nginx/mime.types;
    upstream springboot
    {
        server 127.0.0.1:8080  max_conns=10;
    }

    server
    {
        listen 80;
        listen [::]:80;
        server_name my_server;

        location /
        {
        root /home/DogCommando_Frontend;
        try_files $uri $uri/ /index.html;
        proxy_http_version 1.1;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_set_header X-Forwarded-Port $server_port;
        }
        
       location /api
        {
          proxy_pass    http://springboot;
          proxy_set_header    Host               $host;
          proxy_set_header    X-Real-IP          $remote_addr;
          proxy_set_header    X-Forwarded-For    $proxy_add_x_forwarded_for;
          proxy_set_header    X-Forwarded-Host   $host;
          proxy_set_header    X-Forwarded-Server $host;
          proxy_set_header    X-Forwarded-Port   $server_port;
          proxy_set_header    X-Forwarded-Proto  $scheme;        
        }
    }


  include /etc/nginx/mime.types;
        ##
        # Logging Settings
        ##

        access_log /var/log/nginx/access.log;
        error_log /var/log/nginx/error.log;

        ##
        # Gzip Settings
        ##

        gzip on;
}

如果我把

proxy_pass    http://springboot;

進入第一個“位置/”部分，但在這種情況下我的 Angular-Frontend 不會顯示，即使文件的其余部分看起來像我在上面發布的那個。

我也嘗試了不同種類的

add_header Access-Control-Allow-Origin *;

但問題仍然存在。

我認為存在某種我看不到的基本問題。

因為我在這個領域非常缺乏經驗，所以感謝每一個幫助，如果我錯過了發布一些東西，請告訴我。

謝謝大家！

Answer 1

我終於明白了。

我的問題是我閱讀了很多指南，他們總是談論“本地主機”。 我假設（也許我已經過度閱讀了重要部分）Spring-Application 一旦啟動就可以通過“localhost”或“127.0.0.1”來尋址，但這是錯誤的。

我不得不修改我的 API 調用以使用我的服務器地址而不是“本地主機”。 因此，我從“localhost:8080/api/EXAMPLE”將其重寫為“myserveradress.net/api/EXAMPLE”，並且我在我的問題中發布的 nginx-config 有效並將“/api/”調用重定向到 spring-application。

我希望我所寫的內容是可以理解的，如果有人讀到這篇文章，可以節省一些時間。