URL rewrite with htaccess gets 404 error - AngularJS html5 mode

Question

Angular js page refresh 404 error after removing # and ! from URL

I working on an angular(1.7.5) project, in which I want to remove # and ! from the URL, for that, I use the below code

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

and added base tag in index.html in the root folder

<base href="/myApp/">

and .htaccess file

RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_URI} !index
RewriteRule (.*) index.html [L]

finally, I removed the # and ! from the URL, but the issue is when I refresh the page or open the same URL in new tab the page get 404 error,

http://localhost/dev/ ----- works fine

but

http://localhost/dev/login ----404 error

I dont know how to resolve the issue help me thank you.

Hasta Dhana · Accepted Answer · 2019-06-28 13:06:42Z

0

Try to modify the .htaccess rules like this :

RewriteEngine on
RewriteCond %{REQUEST_FILENAME} -f [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^ - [L]
RewriteRule ^ index.php [L]

answered Jun 28, 2019 at 13:06

Hasta Dhana

4,6947 gold badges21 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

technogeek1995 · Accepted Answer · 2019-06-28 13:07:45Z

0

You need to modify your .htaccess. The problem is that your current rules only forward the first path in the URL. Instead, you need to have it forward all nested paths.

RewriteEngine On  
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
RewriteRule ^ - [L]

RewriteRule ^ /index.html [L]

answered Jun 28, 2019 at 13:07

technogeek1995

3,4842 gold badges35 silver badges52 bronze badges

Collectives™ on Stack Overflow

URL rewrite with htaccess gets 404 error - AngularJS html5 mode

Angular js page refresh 404 error after removing # and ! from URL

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

Angular js page refresh 404 error after removing # and ! from URL

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related