Nodejs & Angularjs, Clean urls

Question

How do I setup node/angular to have the index.html/app run at example.com rather than example.com/app/index.html#/home

I tried putting the index.html at the root of the node server but that still leaves the url as example.com/index.html#/home

Answer 1

What you need is to enable html5mode. It's documentation and considerations can be found here.

Here's an example taken from Brian Ford:

angular.module('myApp', ['myApp.filters', 'myApp.services', 'myApp.directives']).
  config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
    // configure $routeProvider, then...
    $locationProvider.html5Mode(true);
  }
]);

The angular-ui framework has example configuration for wiring this up to express.js:

var express = require('express');
var app = express();

app.use('/js', express.static(__dirname + '/js'));
app.use('/dist', express.static(__dirname + '/../dist'));
app.use('/css', express.static(__dirname + '/css'));
app.use('/partials', express.static(__dirname + '/partials'));

app.all('/*', function(req, res, next) {
    // Just send the index.html for other files to support HTML5Mode
    res.sendfile('index.html', { root: __dirname });
});

app.listen(3006); //the port you want to use

In Brian's article, you don't have to manually map the static asset folders because his example delivers the single index.html, maps partials to /partials/:name, then interacts with /api/*