Nginx Unicorn AngularJS html5 URLs configuration

Question

I want to add pretty URLS in Angular UI-router. I have Nginx + Unicorn over a Rails app with Angular JS as the front-end.

I want to have pretty URLS like mysite/a/b/c, no '#' and no hashbang. When I change the location of nginx to:

server {
    server_name yoursite.com;
    root /path/to/app;

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

Unicorn will throw this error:

directory index of "/path/to/app" is forbidden

Any idea on how to setup nginx to redirect? Giving chmod to my app path isn't a good solution I believe..

Edit: The issue is that with try_files $uri/index @unicorn, it works e.g. url.com/a/b. But when I refresh, it automatically redirects me to root url.com. UI-router suggests try_files $uri $uri/ /index.html, but when I do this I get an access denied by nginx. The folder /path/to/app belongs to user 'deploy', so it's not a chmod issue..

Answer 1

Finally solved it! It was my mistake, because running my app with angular I forgot in the rails routes.rb file this line:

get '*path' => '/'

Changed it to

get '*path' => 'layouts#index' 

where layouts#index is my layout for Angular, and now after refreshing the url.com/a/b the url stays url.com/a/b and renders the appropriate route.

At nginx my config remained:

location /{
    try_files $uri @unicorn;
}