Refreshing page gives "Page not found"


I have an app where it uses a single ng-view and multiple controllers and views.
If I navigate through the root, eg:, everything works. Except that if I hit Ctrl+R (Refresh) then it gives me the 404 eror Page not Found. eg: refreshing on this page gives me error.

But if I access the page using the hashbang then it!/item/1/

How shall I fix this problem?
My .htaccess is empty. And I’m using chrome which support HTML5 hashbang.


When the browser calls!/item/1/, it is calling the index page of, your JS then determines what content to display by analysing the hashtag.

When the browser calls, your server is attempting to serve the index page of, which it cannot find and therefore throws a 404 error.

To achieve what you want, you’ll either need to:

  • Create a rewrite rule to rewrite the links to your root index page
  • adjust your JS so that it generates the hashtag instead of the URL. If you are using AngularJS then turn off html5 mode with $locationProvider.html5Mode(false);, or
  • put an index page in that redirects to!/item/1/ – however note that this would need to be repeated for every /prettyPath/ you crete.

Assuming you are using Apache and your index file is index.html, try adding the following to your .htaccess file to create a rewrite rule before trying either of the other two solutions.

<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteBase /
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteRule ^(.*)       /index.html/#/$1 

If you are using a pure AngularJS/Ajax solution without a server side logic, change index.php to index.html (or index.htm depending on your root index filename).

Answered By – PassKit

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply

(*) Required, Your email will not be published