Error in Setting up NGINX Reverse Proxy with Theia React Application

41 views Asked by At

Actually, I am trying to implement nginx as reverse proxy for my react-theia application.

I am able to access my application on http://localhost:3000/ and my frontend is connected to backend via ip address http:123.234.345.456:9999. But after setting up nginx.conf I am not able to see application on http://localhost/my-ui/ but it only shows spinner like below:

This is the output I am getting after below setup

Below is the my-ui.conf file added into nginx/sites-available folder:

    #listen [::]:80;  # IPv6
    listen 80;       # IPv4
    server_name localhost;

    location /my-ui/ {
        rewrite ^/my-ui(/.*)$ $1 break;
        proxy_pass http://localhost:3000/;
        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-Proto $scheme;

        # Additional configuration to handle WebSocket connections
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "upgrade";
    }

    error_log /opt/homebrew/etc/nginx/error.log;    
}

Here is my host file from my macbook:

127.0.0.1       localhost
255.255.255.255 broadcasthost
::1             localhost

I am getting below error :interrobang: in error.log:

2023/12/21 09:53:09 [error] 33786#0: *25558 kevent() reported that connect() failed (61: Connection refused) while connecting to upstream, client: 127.0.0.1, server: localhost, request: "GET /my-ui/ HTTP/1.1", upstream: "http://[::1]:3000/", host: "localhost"
2023/12/21 09:53:43 [error] 33786#0: *25644 kevent() reported that connect() failed (61: Connection refused) while connecting to upstream, client: 127.0.0.1, server: localhost, request: "GET /my-ui/node_modules_theia_core_lib_browser_i18n_i18n-frontend-module_js.bundle.js HTTP/1.1", upstream: "http://[::1]:3000/node_modules_theia_core_lib_browser_i18n_i18n-frontend-module_js.bundle.js", host: "localhost", referrer: "http://localhost/my-ui/"

I tried IPv4 and IPv6 at top, I also tried adding url of my server with IP address in pass_proxy

But did not work.

0

There are 0 answers