That’s using your head…er()

This is just a quick tip that I know has been demonstrated in other places, but it’s one that I have used frequently to provide an excellent solution to a variety of problems.

If you are using any kind of language on the back-end of your web application (PHP, Python, Ruby, Perl, Erlang, Brainfuck, etc) then you will eventually find yourself in the position of having to send different types of content. It may be XML, it may be a PDF file, it may be streaming video. Whenever you are in this situation, you need to change the Content-type that is sent back to the client. In PHP, you would do this with the header() function. In Python, it’s send_header() with the BasicHTTPServer. Ruby has various methods depending on whether or not it’s Rails or CGI, etc. Ultimately, your back-end code needs to designate to the client that something other than classic text/html is coming down the pipe.

The reason I think this is worth mentioning is because you can also designate a type that is just for JavaScript. This means that you can assemble your JavaScript dynamically on the server side, and have it get read by your browser just as if it was a .js file!

Here’s a simple example of when and how this would be useful. Let’s say you needed to get the user’s IP address into your JS. There are a number of third-party solutions for this, but this method is a much cleaner solution. For starters, in order for this to work, you have to be able to run some kind of server-side scripting language for your site. If you can’t run Perl, or PHP, or some other variant, this will simply be an academic read for you. However, if you are on a host like Bluehost or GoDaddy or Rimu, where you have more control over what your pages are doing, then this will be awesome for you.

For starters, you need some JS code! What do we need the User’s IP for? Well, let’s say we wanted to display a promotion on our page if they are logged in from an IP that starts with 42. Why 42? If you have to ask, you haven’t read enough Douglas Adams.

So, let’s write some basic JS code.

$(function() {
    if (user_ip.match(/^42\./)) {
        $("#hidden_promo_div").show();
    }
});
Okay, that’s really basic. It assumes we have a div on our page with the ID ‘hidden\_promo\_div’ and it is currently hidden via CSS. When we call this, it will be displayed to our user. You’ll note this is in a document.ready function, so it will run once the page is fully loaded. This code is relying on a variable named *user_ip*. Where do we get this variable? We’re going to use PHP to figure it out, but we’re going to tell our PHP to spit out JavaScript to the browser. How? Well, just above your closing tag, add the following line: <script src=”js/user\_ip\_script.php”></script> (You can point it to a PHP file, because we are going to tell our PHP file to output Javascript! If you want, and are comfortable doing so, you could use your .htaccess with Apache and have some funky rewriting rules going on which would make user\_ip\_script.js point to user\_ip\_script.php. It’s unnecessary, but is another layer of ‘cool’ that you can add to your code if you want. Here is a good resource for learning how to do that.) Now that we have that script tag in there, let’s figure out what we’re going to put into that script. First off, you need a php file, named user\_ip\_script.php. Create one in your text editor of choice, and start it off like this:

var user_ip = '<?php echo $user_ip; ?>';

The first line tells the server to process this file as PHP (run it through the PHP parser). The second line is the magic. That tells PHP to respond with content that is identified as JavaScript. Normally, a webpage is announced as being ‘text/html’. There are also other content types (also known as MIME types), such as audio/mp3, video/ogg, and image/gif.  This is associated with a file extension, which is then associated with an application on your computer. This tells your machine how to handle this content.

The third line is getting the user’s IP address from the server and assigning it to a variable named $user_ip. The fourth line closes the PHP part of the code. PHP is an ‘inline’ scripting language, so you can define blocks of PHP code inline with other content. The fifth line is a line of JavaScript, assigning something to the user_ip variable. Again, we are using inline PHP to put the user’s IP address there.

Now, since we are already outputting JS, why not just include our code from above into our PHP script? That way, all the JS content is served to our browser at once, and we only use one