Fix for IE6 and gzip compressed javascripts

For the past two weeks I’ve been struggling with a website. In particular, IE bugs. Of course.

What I had the most problem with is an intermittent problem with IE6 not loading compressed javascripts. It spews out cryptic javascript errors. The debugger is a joke. If you hit reload, sometimes it works. Sometimes it does not. Then it works fine for quite a while. Then the client emails ‘broken’ messages. Argh what a mess.

It turns out to be a bug in IE that has been around since version 5.5 until version 7. Yes that’s right, 6 years! IE loads the first zero bytes of the gzipped javascripts. But if you copy-paste the url of the javascript it loads fine. And then the pages with those javascripts work just fine from there on (probably cached at that point). Wow. Nice work Redmond!

After figuring this out I quickly made a fix. I’ve been using prototype and scriptaculous compressed for quite some time. Since 99% of my work is on shared hosting I just use ColdFusion to server the gzipped version if the browser allows it (keep in mind this is the old code that can have problems in IE6):

<cfif cgi.HTTP_ACCEPT_ENCODING contains "gzip">
	<cfheader name="Content-Encoding" value="gzip" >
	<cfheader name="Content-Type" value="text/javascript" >
	<cfcontent deletefile="no" file="#expandpath('./protoaculous182min.gz')#" type="text/javascript">
<cfelse>
	<cfinclude template="protoaculous182min.js">
</cfif>

The fix then is to exclude IE6, too, from receiving the compressed version. I also added some other bits to make it nicer and more proper:

<cfif cgi.HTTP_ACCEPT_ENCODING contains "gzip" and cgi.HTTP_USER_AGENT does not contain 'MSIE 6.0; Windows'>
	<cfheader name="Content-Encoding" value="gzip" >
	<cfheader name="Content-Disposition" value="inline; filename=""protoaculous182min.gz""">
	<cfheader name="Content-Type" value="application/x-javascript; charset=ISO-8859-1">
	<cfcontent deletefile="no" file="#expandpath('./protoaculous182min.gz')#" type="application/x-javascript; charset=ISO-8859-1">
<cfelse>
	<cfheader name="Content-Disposition" value="inline; filename=""protoaculous182min.js""">
	<cfheader name="Content-Type" value="application/x-javascript; charset=ISO-8859-1">
	<cfinclude template="protoaculous182min.js">
</cfif>

That seems to work flawless in IE6, IE7, IE8, and Firefox3.

Whew. Hope someone out there finds this helpful!

bd