Universal .htaccess for angularjs that works with

Question

This question already has answers here:

$routeParams Hard Refresh not working on server (base tag needed) (2 answers)

Closed 8 months ago.

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

Answer 1

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.

Answer 2

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]