.htaccess excluding directory issue

Question

I have a website consisting of a single index.html file. I have several menus, and need to go 3 levels deep, so I want a php-like structure as such: index.html?main=$1&secondary=$2&tertiary=&3. This has to be reduced to www.example.com/$1/$2/$3. Overall pretty simple I would think, using following rules for in .htaccess:

RewriteRule ^([A-Za-z0-9-]+)/([A-Za-z0-9-]+)/([A-Za-z0-9-]+)?$  index.html?main=$1&secondary=$2&tertiary=$3
RewriteRule ^([A-Za-z0-9-]+)/([A-Za-z0-9-]+)?$  index.html?main=$1&secondary=$2
RewriteRule ^([A-Za-z0-9-]+)?$  index.html?main=$1

Now, I also have several folders in my root folder that shouldn't be affected, otherwise my include's wont work. Looking at this answer I've already tried exluding these folders using RewriteRule ^(bower_components|photos)($|/) - [L] before the other rules, but it didn't work. I've also tried this answer, making a .htaccess with contens RewriteEngine Off and putting it in my folders, also without success. So obviously I'm doing something wrong somewhere. To show my folder layout, here's a quick snapshot of it:

Here's my current .htaccess file:

Options +FollowSymLinks
RewriteEngine On

RewriteCond %{REQUEST_FILENAME} -f  [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule .*  - [L]

RewriteRule ^([A-Za-z0-9-]+)/([A-Za-z0-9-]+)/([A-Za-z0-9-]+)?$  index.html?main=$1&secondary=$2&tertiary=$3
RewriteRule ^([A-Za-z0-9-]+)/([A-Za-z0-9-]+)?$  index.html?main=$1&secondary=$2
RewriteRule ^([A-Za-z0-9-]+)?$  index.html?main=$1

Now, if I go to http://localhost/myProject/activities, so 1 level deep as the index.html file is located in myProject, it does work and all includes are included correctly. However, when going to http://localhost/myProject/activities/test, I get to the basic index.html page, but my includes point to http://localhost/myProject/activities/bower_components/platform/platform.js, so the activities is too much.

Answer 1

Keep your rules like this:

Options +FollowSymLinks
RewriteEngine On
RewriteBase /myProject/

RewriteCond %{REQUEST_FILENAME} -f  [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule .*  - [L]

RewriteRule ^([A-Za-z0-9-]+)/([A-Za-z0-9-]+)/([A-Za-z0-9-]+)/?$  index.html?main=$1&secondary=$2&tertiary=$3 [L,QSA]
RewriteRule ^([A-Za-z0-9-]+)/([A-Za-z0-9-]+)/?$  index.html?main=$1&secondary=$2 [L,QSA]
RewriteRule ^([A-Za-z0-9-]+)/?$  index.html?main=$1 [L,QSA]

Then for css/js/image inclusion just use absolute path in your css, js, images files rather than a relative one. Which means you have to make sure path of these files start either with http:// or a slash /.

You can also try adding this in your page's HTML header: <base href="/myProject/" /> so that every relative URL is resolved from that URL and not the current URL.