Refreshing page gives "Page not found"

angularjs

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

When the browser calls http://example.com/item/1/, your server is attempting to serve the index page of http://example.com/item/1/, 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 http://example.com/item/1/ that redirects to http://example.com/#!/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 
</IfModule>

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).

You need to just add the below script in your .htaccess

RewriteEngine On 
Options FollowSymLinks

RewriteBase /

RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ /#/$1 [L]

Refreshing page gives "Page not found"

Related

Recent Posts