Apache .htaccess for HTML5 push state manipulations

Blog/Architecture · 2015-12-20 · dev krasimir navigo home dev krasimir http home dev index html html http home index html http browser routing

This is a quick post so I document my two hours research. I'm working on a open source library for routing in the browser. Or in other words JavaScript library that uses the history API. The thing is that locally I'm using Apache as a dev server and I wanted all the request to specific folder to be redirected to index.html.

What I meant is the following:

http://home.dev/Krasimir/navigo/example/ -> http://home.dev/Krasimir/navigo/example/index.html http://home.dev/Krasimir/navigo/example/products -> http://home.dev/Krasimir/navigo/example/index.html http://home.dev/Krasimir/navigo/example/products/something/blah -> http://home.dev/Krasimir/navigo/example/index.html

In order to do the routing entirely in the browser I needed all the child routes to be forwarded to the same index.html file. The .htaccess file that I ended up with is as follows:

  Options +FollowSymLinks
  IndexIgnore */*
  RewriteEngine On
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule (.*) index.html

I found the solution here https://gist.github.com/rayfranco/3211654.