Code: XSSI Browser Sniffing

Chapter 6 - Web Page Optimization

Using conditional server-side includes (XSSIs), you can create environment variables that closely mimic JavaScript-based sniffing. For example, this common JavaScript filter:

IS_IE = (document.all) ? true : false;
IS_MAC = (navigator.appVersion.indexOf(" Mac") != -1);
IS_OPERA = (navigator.userAgent.indexOf(" Opera") != -1);
IS_OPERAMAC = IS_OPERA && IS_MAC;

becomes this XSSI equivalent:

<!--#if expr="$(HTTP_USER_AGENT) = /MSIE [4-9]//" -->
    <!--#set var="isIE" value="true" -->
<!--#endif -->
<!--#if expr="$(HTTP_USER_AGENT) = /Mac/" -->
    <!--#set var="isMAC " value="true" -->
<!--#endif -->
<!--#if expr="$(HTTP_USER_AGENT) = /Opera/" -->
    <!--#set var="isOPERA" value="true" -->
<!--#endif -->
<!--#if expr="(${isOPERA} && ${isMAC})/" -->
    <!--#set var="isOPERAMAC" value="true" -->
<!--#endif -->

Now you can use these XSSI variables to conditionally include code within your XSSI includes without the need for JavaScript:

<!--#if expr="${isIE}" -->
    ie.js
<!--#elif expr="${isOPERAMAC}" -->
    operamac.js
<!--#elif expr="${isOPERA}" -->
    opera.js
...
<!--#endif -->

It is faster to set environment variables at the server by configuring your httpd.conf file using BrowserMatchNoCase. For example:

BrowserMatchNoCase "MSIE [4-9]" isIE
BrowserMatchNoCase Mac isMAC
BrowserMatchNoCase Opera isOPERA