Getting 404 page on refresh on AngularJS site? Getting 404 page on refresh on AngularJS site? angularjs angularjs

Getting 404 page on refresh on AngularJS site?


I came across a solution here: https://coderwall.com/p/kfomwa

Here's the short post:

angularjs provides html5Mode, which makes your app use pushstate-based URL instead of hashtags. However this requires server side support, since the generated urls need to be rendered properly as well.

This actually works fine with github pages' custom 404 pages, though it's only available for custom domain enabled pages.

First, copy everything inside index.html to 404.html. Then, add this to your app:

 angular.module('app', []).config(function($locationProvider) {      $locationProvider.html5Mode(true);    });

Note that if you are on angular 1.1.5, make sure you set for html5Mode to work properly.

Following these suggestions I was able to get my site working properly. Now when I hit Reload, the page loads properly.


The better option would be to redirect any url to the index.html:

RewriteEngine onRewriteCond %{REQUEST_FILENAME} !-fRewriteRule ^.*$ index.html

This will NOT cause a 404 response on any page.


Github pages only serves static files. It won't read any configuration settings you have for Apache in .htaccess.

If you want to run an AngularJS app out of Github pages, you cannot use html5Mode.