Still getting 'Not Found' when manually refreshing with angular.js route
Solution 1
I don't know if this is the optimal solution, but I did find a combination of settings that worked:
- Include the
hashPrefix('!')
(see below) - Did not include
<base href="/">
in my index.html - Added
FallbackResource /index.html
to my<Directory PATH_TO_WWW_FILES>
section in my server.conf
file per this post. After setting this, it didn't seem to matter what the localmod_rewrite
settings were.
// Routing configuration.
angular.module('myModule')
.config(['$routeProvider', '$locationProvider',
function ($routeProvider, $locationProvider) {
// Enable pushState in routes.
$locationProvider.html5Mode(true).hashPrefix('!');
$routeProvider
.when('/home', {
templates: {
layout: '/views/home.html'
},
title: 'Welcome!'
})
.when('/launchpad', {
templates: {
layout: '/views/layouts/default.html',
content: '/views/partials/profile.html'
},
title: "Launchpad"
})
.otherwise({
redirectTo: '/home'
});
}
]);
Solution 2
This .htaccess setting worked well for me
<IfModule mod_rewrite.c>
Options +FollowSymlinks
RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_URI} !^/$
RewriteRule (.*) /#!/$1 [NE,L,R=301]
</IfModule>
Solution 3
I couldn't comment but as well as using HTML mode
, base href="/"
, sudo a2enmod rewrite
, using .htaccess
rewrite. From Unispaw, I had to AllowOverride All
in both the sites available of your site and the /etc/apache2 apache.conf
Solution 4
For people who are still facing this error, with or without SSL:
Make sure you Allowoverride in your apacheconfig e.g.
<Directory "/var/www/mysite/public_html">
AllowOverride All
</Directory>
for both ports is u use SSL
Jay
Updated on July 05, 2022Comments
-
Jay almost 2 years
After reading a ton of write-ups and stackoverflow questions on Angular.js route, I'm still getting the 'Not Found' error when I do a manual refresh.
Steps:
- browse to
localhost
--> because of my configuration (below), I'm taken tolocalhost/home
. Views and everything load fine. - hit refresh in the browser --> browser displays this
Not Found: the requested /home is not found on this server
This question is probably most like Refreshing page gives "Page not found"
My configuration
// Routing configuration. angular.module('myModule') .config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider) { // Enable pushState in routes. $locationProvider.html5Mode(true); $routeProvider .when('/home', { templates: { layout: '/views/home.html' }, title: 'Welcome!' }) .when('/launchpad', { templates: { layout: '/views/layouts/default.html', content: '/views/partials/profile.html' }, title: "Launchpad" }) .otherwise({ redirectTo: '/home' }); } ]);
Other things I have done:
- In my
index.html
, I already have the<base href="/">
- upgraded to angular 1.2.1
Here are the htaccess rules I have tried. None work.
from Refreshing page gives "Page not found"
<ifModule mod_rewrite.c> RewriteEngine On RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteCond %{REQUEST_URI} !index RewriteCond %{REQUEST_URI} !.*\.(css|js|html|png) #Add extra extensions needed. RewriteRule (.*) index.html [L] </ifModule>
from http://ericduran.io/2013/05/31/angular-html5Mode-with-yeoman/
<IfModule mod_rewrite.c> RewriteEngine On RewriteBase / RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule ^(.*) /index.html/#!/$1 </IfModule>
- browse to