Universal .htaccess for angularjs that works with HTML5 route parameters [duplicate]

Here is the .htaccess file I have currently:

    RewriteEngine on

    # Don't rewrite files or directories
    RewriteCond %{REQUEST_FILENAME} -f [OR]
    RewriteCond %{REQUEST_FILENAME} -d
    RewriteRule ^ - [L]

    # Rewrite everything else to index.html to allow html5 state links
    RewriteRule ^ index.html [L]

It works for url's like this:

http://domain.com/view

http://domain.com/otherview

But if I try and do a hard refresh on parameters like this:

http://domain.com/view/3523

http://domain.com/view/1234/5322

If I do a hard refresh on any parameter generated pages it just shows index.html without any Javascript loaded, which breaks the page.

The parameter URL's work if I navigate to the page from within the app, otherwise they don't work.

How do I get parameter URL's to work on a hard refresh within AngularJS.

I also have HTML5 mode turned on:

$locationProvider.html5Mode(true);

Answers:

Answer

You can use the following instead:

RewriteEngine On

RewriteCond %{REQUEST_FILENAME} -s [OR]
RewriteCond %{REQUEST_FILENAME} -l [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^ - [NC,L]

RewriteRule ^ index.html [NC,L]
Answer

I found the solution in the other post: AngularJS routes + .htacces rewriting + route Parameters = not working

You just need to put your base tag at the top of all tags. At least it worked for most of us.

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.