NGINX Run multiple application on same port with different route path

Question

I have two applications, app1 is developed in reactJS and app2 in angularJS sharing same login session,

 - Application 1
http://application-1:1234/
 - APplication 2
http://application-2:2345/

My needs is to have a seemless navigation between both apps, as they share the same login credentials.

I have created NGINX reverse proxy configuration,

server {
    listen 8080;
    server_name http://global-ip:8080;
    location / {
        proxy_pass http://application-1:1234;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
     }
    location /application-2 {
        proxy_pass http://application-2:2345;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
     }

}

As the above configuration is working for only, First default root path. The other /application-2 is not able to redirect to specified path.

Any help will be appreciated.

Thanks Praveen T

Try add one more slash (/) to the application2 block like this `location /application-2/ {...}` — Ted, Jul 06 '20 at 15:25
Hi Ted, Thanks for the reply I tried the suggestion but there it gives 404 error — praveen2609, Jul 06 '20 at 15:29
As per the above configuration of nginx default file working for only, First default root path (I.e. location /). The other /application-2 is not able to redirect to specified link of application-2. — praveen2609, Jul 06 '20 at 19:09
Seem like you need to add one more slash in here, change `proxy_pass http://application-2:2345;` to `proxy_pass http://application-2:2345/;` Respone if it works bro. — Ted, Jul 07 '20 at 02:35
But is it 404 error or other came ? I tried that config with my simple application but it got same problems. Even i added some slashes but it just solved404 problem then other issues came. I checked network of Chrome developers tool then there ware a lot of problems about URI. I think this is not a good practise of config when i read these questions: https://serverfault.com/questions/650117/serving-multiple-proxy-endpoints-under-location-in-nginx https://serverfault.com/questions/706694/use-nginx-as-reverse-proxy-for-multiple-servers — Ted, Jul 07 '20 at 06:14
Ya it is giving blank page, not able to load the page itself. — praveen2609, Jul 07 '20 at 07:32

score 4 · Accepted Answer · answered Jul 07 '20 at 11:52

4

As a quick hack, try either

location /application-2/ {
    proxy_pass http://application-2:2345/;
    ...
}

or

location /application-2/ {
    rewrite ^/application-2(.*) $1 break;
    proxy_pass http://application-2:2345;
    ...
}

but you'd better build you angular app according to your URI prefix, see instructions here. Then your original config should work as expected.

answered Jul 07 '20 at 11:52

Ivan Shatsky

13,267
2
21
37

Hey Ivan, Thanks a lot man, the above method didn't worked but the link which you have provided to change the URI prefix in the angular app have worked. – praveen2609 Jul 07 '20 at 15:51
– praveen2609 Jul 07 '20 at 15:52
No Ivan, that workaround didn't got succeeded, I tried before as well :) – praveen2609 Jul 07 '20 at 15:54
1

@praveen2609 Well, anyway setting correct `base href` is the best approach for this case. – Ivan Shatsky Jul 07 '20 at 15:56
Yes, your right Ivan setting correct base href is the best approach. It was a great help as i was struggling to find the solution but the way you gave the direction have helped me. Thanks again for your valuable input and stay safe and stay at home. – praveen2609 Jul 07 '20 at 15:58
@praveen2609 So you still keep original nginx config and just change base href ? – Ted Jul 08 '20 at 01:00
Yes Ted, Keeping the configuration same and changed the base href url as per the above comment. – praveen2609 Jul 08 '20 at 08:03

NGINX Run multiple application on same port with different route path

1 Answers1

Linked