当我更改我的nginx proxy_pass设置时,我的react应用程序无法加载

sycxhyv7  于 2023-08-03  发布在  Nginx
关注(0)|答案(2)|浏览(164)

我有react app node js backend和nginx。我已经获得证书并通过Certbot安装它。
我的应用程序发出get和post请求,但为此我需要设置proxy_pass设置。
我的服务器数据块文件:

server {

        root /var/www/nikolsoborsocial/html;
        index index.html index.htm index.nginx-debian.html;

        server_name nikolsoborsocial nikolsoborsocial.org
                                     www.nikolsoborsocial.org;

        location / {
                try_files $uri $uri/ =404;
                               
        }
        
        

    listen [::]:443 ssl ipv6only=on; # managed by Certbot
    listen 443 ssl; # managed by Certbot
    ssl_certificate /etc/letsencrypt/live/nikolsoborsocial.org/fullchain.pem; # managed by Certbot
    ssl_certificate_key /etc/letsencrypt/live/nikolsoborsocial.org/privkey.pem; # managed by Certbot
    include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
    ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot

}

server {
    if ($host = www.nikolsoborsocial.org) {
        return 301 https://$host$request_uri;
    } # managed by Certbot

    if ($host = nikolsoborsocial.org) {
        return 301 https://$host$request_uri;
    } # managed by Certbot

        listen 80;
        listen [::]:80;

        server_name nikolsoborsocial nikolsoborsocial.org
                                     www.nikolsoborsocial.org;

        
        return 404; # managed by Certbot

}

字符串
我需要在哪里添加proxy_pass设置?

proxy_pass http://localhost:3000;
include proxy_params;


如果我把它放在433服务器位置,而不是try_files $uri $uri/ =404;我的React应用程序不加载,我在浏览器中得到Cannot GET /错误。

cx6n0qe3

cx6n0qe31#

你设置了nginx配置文件来服务react文件在服务器块中,它是'位置/'。
因此,如果您尝试在'location /'块中添加proxy_pass设置,它将覆盖提供react文件的代码。Nginx会将请求代理到运行在localhost:3000上的后端服务器。

如何解决这个问题?

您必须在后端服务器中为该请求提供文件,或者添加新的位置块。
以下是添加新位置块示例

server {
    root /var/www/nikolsoborsocial/html;
    index index.html index.htm index.nginx-debian.html;

    server_name nikolsoborsocial nikolsoborsocial.org www.nikolsoborsocial.org;

    location / {
        try_files $uri $uri/ =404;
    }

    # Proxy Pass settings
    location /app {
        proxy_pass http://localhost:3000;
        include proxy_params;
    }

    # SSL configuration
    listen [::]:443 ssl ipv6only=on;
    listen 443 ssl;
    ssl_certificate /etc/letsencrypt/live/nikolsoborsocial.org/fullchain.pem;
    ssl_certificate_key /etc/letsencrypt/live/nikolsoborsocial.org/privkey.pem;
    include /etc/letsencrypt/options-ssl-nginx.conf;
    ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem;
}

字符串

9vw9lbht

9vw9lbht2#

我更改了配置文件:

server {

    root /var/www/nikolsoborsocial/html;
    index index.html index.htm index.nginx-debian.html;

    server_name nikolsoborsocial nikolsoborsocial.org
    www.nikolsoborsocial.org;

    location /api/ {
        proxy_pass http://localhost:3000;
        # include proxy_params;
    }

    listen [::]:443 ssl ipv6only=on; # managed by Certbot
    listen 443 ssl; # managed by Certbot
    ssl_certificate /etc/letsencrypt/live/nikolsoborsocial.org/fullchain.pem; # managed by Certbot
    ssl_certificate_key /etc/letsencrypt/live/nikolsoborsocial.org/privkey.pem; # managed by Certbot
    include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
    ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot

}

server {
    if ($host = www.nikolsoborsocial.org) {
        return 301 https://$host$request_uri;
        } # managed by Certbot

        if ($host = nikolsoborsocial.org) {
            return 301 https://$host$request_uri;
            } # managed by Certbot

            listen 80;
            listen [::]:80;

            server_name nikolsoborsocial nikolsoborsocial.org
            www.nikolsoborsocial.org;

            return 404; # managed by Certbot

        }

字符串
感谢您的指导@ACS
location /API/ -解决问题!

相关问题