By: Kevin Yank

November 21st, 2001

Reader Rating: 8

In this short article, I'll demonstrate how to replace lengthy client-side JavaScript browser detection code with a server-side equivalent written in PHP.

In the career of every Web designer, there are times when the differences between browsers makes it impossible to get a single piece of code to work the same on all browsers. As of this writing, the standard SitePoint page header, for example, squishes some form fields into rather small spaces. The techniques that make this possible vary from browser to browser.

In such cases, developers often resort to browser-detection code, like this:

<script language="JavaScript" type="text/javascript">
if (navigator.appName == "Netscape" &&
   parseInt(navigator.appVersion) > 4) {
 document.writeln("<!-- Netscape 6 specific code -->");
} else {
 document.writeln("<!-- Code for other browsers -->");
}
</script>

Not only is this rather ugly to read and maintain, but when the snippets of code required for each browser are longer than a line or two, the burden of extra code that must be downloaded by all browsers can begin to slow down the page load process. Remember, JavaScript is run in the user's browser, so the code for all browsers is downloaded, even though only one of the code segments is actually used.

When the size of the code becomes a concern, it is often preferable to do the browser detection on the server side. Here's the equivalent of the above JavaScript example in PHP:

<?php
if (!(strpos($HTTP_USER_AGENT,'Mozilla/5') === false)) {
 echo("<!-- Netscape 6 specific code -->");
} else {
 echo("<!-- Code for other browsers -->");
}
?>

The variable $HTTP_USER_AGENT is automatically set in all PHP scripts that are run by a Web server. The string contained in that variable can be used to identify the browser responsible for the page request. For example, the $HTTP_USER_AGENT string produced by Netscape 6.2 running on Windows is as follows:

Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:0.9.4) Gecko/20011019 Netscape6/6.2

We then use the PHP strpos function to detect the string 'Mozilla/5' in the $HTTP_USER_AGENT variable. To distinguish between instances where 'Mozilla/5' occurs at the beginning (position 0) of $HTTP_USER_AGENT (when strpos returns 0) and instances where it doesn't occur at all (when strpos returns false), I used === to detect only the latter case.

This remedies the problem of code bulk on the client, but it's still pretty messy on the server side, and the code can be a little hard to remember. The solution is to write yourself a script that performs the browser detection and stores the result in a variable, which can then be used throughout your site wherever needed.

Here's the browserdetect.php script we use here at SitePoint.com:

<?php

/**
*  $browser will contain one of the following values:
*      'iewin' : IE 4+ for Windows
*      'iemac' : IE 4 for Macintosh
*     'ie5mac' : IE 5 Macintosh
*      'nswin' : Netscape 4.x Windows
*     'nsunix' : Netscape 4.x Unix
*      'nsmac' : Netscape 4.x Mac
*        'ns6' : Netscape 6 / Mozilla
*/

function inAgent($agent) {
   global $HTTP_USER_AGENT;
   $notAgent = strpos($HTTP_USER_AGENT,$agent) === false;
   return !$notAgent;
}

if ( inAgent('MSIE 4') or inAgent('MSIE 5') ) {
 if ( inAgent('Mac') )
   $browser = inAgent('MSIE 5') ? 'ie5mac' : 'ie4mac';
 elseif ( inAgent('Win') ) $browser = 'iewin';
} elseif ( !inAgent('MSIE') ) {
 if ( inAgent('Mozilla/5') or inAgent('Mozilla/6') ) {
   $browser = 'ns6';  
 } elseif ( inAgent('Mozilla/4') ) {
   if ( inAgent('Mac') ) $browser = 'nsmac';
   elseif ( inAgent('Win') ) $browser = 'nswin';
   else $browser = 'nsunix';
 }
} else $browser = "unknown";

?>

With this script on hand, server-side browser detection becomes quite simple. Here's an example:

<?php include(browserdetect.php); ?>
<?php if ($browser == 'ns6'): ?>
 <!-- Netscape 6 specific code -->
<?php else: ?>
 <!-- Code for other browsers -->
<?php endif; ?>

This code considerably more neat and tidy, especially if instead of including the HTML code directly in the one file, you use include files for each browser-dependant segment of the page.