noob's problem with mod rewrite and relative urls

Question

I must be doing something terribly wrong because no matter how i try or google it, i can't find an answer :(

So, i want to have a url like http://localhost/BLUEPRINT/list/857 to actually load a perfectly working url like this: http://localhost/BLUEPRINT/list.php?lid=857

I can write the rewrite rule in the .htaccess file and i can read the lid variable. The problem is that all the paths in list.php are relative. Css, images, javascript e.t.c. So when the SEO-friendly url loads all those items are looked inside BLUEPRINT/list/857/...

So for example this: <img src="images/logo.png" /> is actually something like this when requesting the seo-friendly url: <img src="list/857/images/logo.png" />

So what can i do?

I could probably try to convert all paths in the page(s) to root relative (ex. "/BLUEPRINT/images/logo.png") instead of relative. But there are dozens in the page and even if i do, they will not work on the actual server because there it sould be "/images" instead of "/BLUEPRINT/images". So i could not just upload my files to the actual server.

What are my options? How do all these wonderful scripts out there like wordpress, joomla, e.t.c. handle this problem? What the hell am i doing wrong? It drives me crazy!

Answer 1

Have you tried applying the "RewriteBase"-Rule?

http://httpd.apache.org/docs/2.0/mod/mod_rewrite.html#rewritebase

Answer 2

You can write a condition which allows the requests to CSS, JS and other paths to passthrough and ignore your rewrite rules for list.php. Here is an example.

# Turn on URL rewriting
RewriteEngine On

# If your URL is www.example.com/, use /
RewriteBase /

# Find CSS and JS paths
RewriteCond $1 ^(BLUEPRINT/css|BLUEPRINT/js)

# No rewriting
RewriteRule ^(.*)$ - [PT,L]

Here is a great tutorial from Apache with a ton of examples: http://httpd.apache.org/docs/2.2/misc/rewriteguide.html

Good Luck!

EDIT: Another good link from Apache is the mod_rewrite docs. http://httpd.apache.org/docs/2.2/mod/mod_rewrite.html Do a text search for 'passthrough'.

Another part of the RewriteRule to note is the dash '-'. It means that "no substitution should be performed."

Finally, I've added the RewriteEngine and RewriteBase rules to the example. This should make it more complete.

Answer 3

Your new URLs don’t have the same base path prefix. That means relative URL paths are resolved differently. The reference images/logo.png is now resolved to /BLUEPRINT/list/images/logo.png instead of to /BLUEPRINT/images/logo.png.

To fix this either use absolute URL paths in your references like:

<img src="/BLUEPRINT/images/logo.png" />

Or, if you don’t want to add the base URL path /BLUEPRINT/ to all of your referencing elements, set the base URL with base:

<base href="/BLUEPRINT/" />

Now relative URL paths are resolved from this base URL instead of the current URL. But note that changing the base URL affect all relative URLs.