How do you handle routing in a Node + Ember application?

Question

I have a Node + Ember application. I ran into an issue around routes. Both Node and Ember handle routes and I have some routes that I would like Node to handle but some, I want Ember to handle. For instance, when the page loads, Node's router kicks in so any route I declare in Ember is useless.

Assume that I have a route called 'settings' in Ember JS. When I navigate to ' http://myapp.com/settings ' by using the {{#link-to}} helper from another view in Ember, I can see the page. However, once I am on that page and hit reload, I get a 404 because Node's router is called and that route is not declared in Node. How do I resolve this?

Answer 1

I don't use node but I imagine the concept is probably the same for you as it is for my app (I'm using Java Spring). You should modify your route to app.get('/*') or however you use wildcards in node and return Ember's index.html. So basically, any url under / aka all of them get your Ember app, not just the / route

Ember handles the rest. Take a look at this thread (its for nginx, but again the principal is the same): http://discuss.emberjs.com/t/how-to-serve-all-routes-on-a-production-server-exactly/6372/2

In case that link goes down at some point in the future, here's the useful nginx configuration that rewrites all rules under / except for assets with the ember index.html page:

server {
    listen 80 default;
    server_name my.domain.com;
    root /path/to/app/root;

    location / {
        rewrite ^ /index.html break;
    }

    location /assets/ {
        # do nothing and let nginx handle this as usual
    }
}