NGINX不将呼叫从React应用路由到后端应用

时间:2019-04-03 21:23:33

标签: nginx nginx-location nginx-reverse-proxy nginx-config

我有一个AWS Ubuntu服务器,该服务器托管运行在127.0.0.1:4100上的react前端,并使用端口127.0.0.1:1323对Go应用进行api调用。我在/etc/nginx/sites-available/default配置文件中安装了Nginx并为这两个端口设置了代理服务器通行证,但是我只得到Nginx调用的前端。使用chrome inspect检查Go应用程序为什么不能提供react应用程序的某些功能,我看到了此错误

  

client.js:772 GET http://127.0.0.1:1323/api/ net :: ERR_CONNECTION_REFUSED   错误错误:请求已终止可能的原因:网络处于脱机状态,Access-Control-Allow-Origin不允许起源,正在卸载页面,等等。

我在做什么错?以下是我的默认配置文件

server { 

listen 80 default_server; 
listen [::]:80 default_server; 

server_name _; 

location / { 

proxy_pass http://127.0.0.1:4100; 

} 

location /api { 

proxy_pass http://127.0.0.1:1323/; 

 } 
}

1 个答案:

答案 0 :(得分:0)

您的服务器正在监听端口80:

listen 80 default_server; 
listen [::]:80 default_server; 

因此,您应该向该端口发出请求:

GET http://127.0.0.1/api/     => http://127.0.0.1:1323/
GET http://127.0.0.1:80/api/  => http://127.0.0.1:1323/
GET http://127.0.0.1/         => http://127.0.0.1:4100/
GET http://127.0.0.1:80/      => http://127.0.0.1:4100/

然后nginx应该正确代理您的请求。

更新

要更清楚地了解nginx配置。

server { 

listen 80 default_server;  // The port nginx is listening to ipv4
listen [::]:80 default_server; // The port nginx is listening to ipv6

server_name _; 

location / { // When you call this location...

proxy_pass http://127.0.0.1:4100; // You'll be redirected to this location

} 

location /api { // When you call this location...

proxy_pass http://127.0.0.1:1323/; // You'll be redirected to this location

 } 
}

您的配置没问题according to nginx docs

您说客户正在尝试访问http://127.0.0.1:1323/api/,但是应该请求http://127.0.0.1/api/(绕过端口)重定向到http://127.0.0.1:1323/

这是另一个例子:

server { 

    listen 80; 

    server_name localhost anywebsite.com; 

    location ~* ^/MyApp {
        proxy_pass http://localhost:5130;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection keep-alive;
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_send_timeout 2m;
        proxy_read_timeout 2m;
    }
}

在这种情况下,每次我的网址以/MyApp结尾,例如:http://anywebsite.com/api/MyApp,我都会被代理到http://localhost:5130。但是,如果我尝试访问http://localhost:5130http://anywebsite.com:5130/api/MyApp,我将无法访问,因为nginx仅在监听端口80。如果要访问另一个端口,则需要这样指定:

server {
    listen 80; 
    listen 5130; 

[...]