AngularJS: can't get html5 mode urls with ui-route $state AngularJS: can't get html5 mode urls with ui-route $state angularjs angularjs

AngularJS: can't get html5 mode urls with ui-route $state


This configuration has worked for many of our Apache users using html5mode and ui-router.

<VirtualHost *:80>    ServerName my-app    DocumentRoot /path/to/app    <Directory /path/to/app>        RewriteEngine on        # Don't rewrite files or directories        RewriteCond %{REQUEST_FILENAME} -f [OR]        RewriteCond %{REQUEST_FILENAME} -d        RewriteRule ^ - [L]        # Rewrite everything else to index.html to allow html5 state links        RewriteRule ^ index.html [L]    </Directory></VirtualHost>

Also please make sure you are not a victim of <base href> bug. See the ui-router FAQ for more info.


If working in a shared hosting that doesn't allow to edit Apache configuration you can set this in your .htaccess file to make $locationProvider.html5Mode(true) work (as @Shanimal pointed in @nfiniteloop answer):

RewriteEngine onRewriteBase /path/to/app #change this!# Don't rewrite files or directoriesRewriteCond %{REQUEST_FILENAME} -f [OR]RewriteCond %{REQUEST_FILENAME} -dRewriteRule ^ - [L]# Rewrite everything else to index.html to allow html5 state linksRewriteRule ^ index.html [L]

And don't forget to add <base href="/path/to/app/"> in the HTML <head>.