如何在Rails Box上使用Nginx代理Angle App？

Question

I have one domain and two servers, one running rails one angular js.

The domain name points to the box running rails.

I want to use a path as a namespace to serve up my angular site via proxy_pass.

For example..

mydomain.com/#/admin or mydomain.com/admin <-- This should proxy_pass to the angular server

mydomain.com or mydomain.com/anything-except-admin <-- this should serve up rails content

I've tried may things to get this to work, but the problems I run into are:

Problem 1

Angular uses the '#' symbol at the root path. Rails will always interpret the '#' symbol as root also.

So any thing served from mydomain.com/#/ is interpreted by rails as mydomain.com/

This means that mydomain.com/#/admin is considered mydomain.com/

But angular needs the '#' symbol, so the angular app will not be found in this case.

Problem 2

As an attempt to resolve the first problem, there is a way in angular to avoid using the '#' symbol.

$locationProvider.html5Mode(true)

While this does in part solve the first problem, it introduces another. For instance:

mydomain.com/admin <-- this works to serve up the angular app

Once here, as I navigate the angular app as a user would in the browser, all is fine. But if I refresh the page, I get a 404 or an nginx error depending on how I've setup the proxy_pass

For example, if I navigated here by clicking around the angular app:

mydomain.com/admin/dashboard then I refresh the page, it is interpreted as a new GET request to that path, and I could not get the proxy_pass to pass the request to angular, so it always hit the rails app. Since there is no route for this path in rails I get a 404.

Problem 3

Finally, it's been proposed to use custom subdomains. Unfortunately I can't because this app requires wildcard subdomains as part of the multi-tenant authentication. This is business rule that can't be changed.

Any ideas?

Answer 1

You need something like that:

server {
    # implemented by default, change if you need different ip or port
    # listen *:80 | *:8000;

    # same as server_name  yoursite.com  www.yoursite.com  *.yoursite.com;
    server_name .yoursite.com;

    location / {
            try_files $uri $uri/ @ruby;
    }

    location ~ ^/(\#/)?(admin) {
            try_files $uri $uri/ @angular;
    }

# there must be configured @ruby and @angular locations
<...>
}

Here is documentation on server_name and locations , please give it a try and tell us if there will be any problems. For debugging locations and whole configuration your best friends are /var/log/nginx/access.log and /var/log/nginx/error.log .