Simple mod_rewrite with .htaccess

mod_rewrite is a rewrite engine used to rewrite requested URLs on servers running Apache. It is used to write URLs that contain query string parameters to SEO friendly and “clean” URLs. So for example if you had an an e-commerce site the following URL…

http://www.yoursite.com/index.php?category=clothing&type=shirts

That’s kind of ugly right? It would be nice if we could be rewrite this URL to something much nicer. Fortunately, we can do this using mod_rewrite…

http://www.yoursite.com/clothing/shirts

Pretty slick, eh? The functionality that handles how to rewrite URLs are defined in Apache server .htaccess files. In this post we are going to show a very basic example of how to rewrite some URLs. URL rewriting is no casual affair. It can take a long time to really understand and even then it can still sometimes get a bit confusing when URLs get more complex . Fortunately there are some good guides out there for anybody who is looking to learn more. I think that the tutorial at Nettuts is a great place for a more comprehensive look at URL rewriting as it goes much further in depth compared to what we are going to show today. What we are going to show is a really basic demo of what URL rewriting can do so that you can have a good starting point on your long (and hopefully happy) road of learning URL rewriting.

So to start, I am going to assume you have WAMP server (or MAMP) or XAMPP setup locally for a Apache/MySQL/PHP development environment. If you’re not sure how to do this, there are lots of great tutorial videos that can be found on YouTube. If you have a server somewhere out on the internet you could do this tutorial there as well, though it would be live for everyone to see.

To start out your’re going to want to create a new directory in your server (let’s call it “demo”). So if you’re running your server you should be able to go to http://localhost/demo or http://127.0.0.1/demo (if you are using port 80) and see the directory that this maps to. If you are using a different port, you’d just have to append that to the end of localhost (e.g. http://localhost:8976/demo). Let’s create an index.php file in this directory and add the following code so we can see if we are going to the right place…

<?php
echo 'Rewriting query string...';
?>

If you visit http://localhost/demo you see “Rewriting query string…” outputted to the browser, congratulations you are in the right place.

Let’s add the following item to our index.php file…

<?php
echo 'Rewriting query string...';
echo $_SERVER['QUERY_STRING'];
?>

If you visit http://localhost/demo now you’re not going to see anything different. However, if we visit http://localhost/demo?category=clothing we see the query string that we’ve added is output to the browser. You can make the query string as long as you like: http://localhost/demo?category=clothing&type=shirts&color=red&size=large

But as we’ve said before.. .these URLs are ugly. So now we are going to create an .htaccess file to rewrite these URLs and make them into clean URLs. Create an .htaccess file and place it in our demo directory.

Now add the following code to it…

<IfModule mod_rewrite.c>
  Options +FollowSymlinks
  RewriteEngine On
  RewriteBase /demo/
</IfModule>
<IfModule mod_rewrite.c>
# If only version specified...
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{DOCUMENT_ROOT}/%{REQUEST_FILENAME} !-d
  RewriteCond %{DOCUMENT_ROOT}/%{REQUEST_FILENAME} !-f
  RewriteRule ^(.[^/]*)[/]?$ index.php?category=$1 [L,QSA]

What this is saying is that if we have the mod_rewrite module installed, use the rewrite engine. We’re also going to use the base as /demo/. Below this we are actually going to define our rewrite rules.

Now if we go to http://localhost/demo/clothing what happens? We still see the query string because our rewrite rule is taking effect. Look at that. We have this nice url that still has access to the query string value (which we can do anything we want with in code either on the client side or the server side).

Now go to http://localhost/demo/books. Here again we see the query string value has changed to “books” is available to us even though we are using our nice URLs!

Not bad. Not bad at all.