Amazon CloudFront with IIS7

Recently I have been working on a CSS & Javascript bundle called “Jon Kragh Starter” that I created as a starting point for all of my web projects.

I turned to Amazon’s CloudFront service as a CDN for my JS & CSS files.  Amazon won for me because I need SSL, and their offering was the cheapest in that regard.

My site is hosted on Windows Server 2008 R2 Standard with IIS 7.5.  Setting up Cloud Front was easy.  I simply pointed it to my site as a “Custom Origin” and then 10 minutes later, I was about to view my content under the URL that CloudFront generates.

image

The biggest challenge was to get CloudFront to serve my gzipped css and JavaScript.  CloudFront will serve Gzipped content if your origin server returns gzipped content to CloudFront, when CloudFront requests it with the user’s headers.

So first and foremost you need to ensure your origin server serves Gzipped content.  Here is an example at my origin.  Using Firebug’s network tab you can inspect the response headers:

SNAGHTML138c082a

The trick is to get CloudFront to serve the same Gzipped content.  It turns out that IIS will not return gzipped content to CloudFront in its default configuration.

Many thanks to this thread for pointing me to the correct solution.  What worked for me was to add the flags noCompressionForHttp10="false" noCompressionForProxies="false" to the server’s applicationHost.config file followed by a global “iisreset” from the command line.

Keep in mind during your testing, you will need to add new files to your server when you retry to see if you get your gzipped content from CloudFront.  This is because CloudFront caches your content.  There is a way to invalidate it through their API, but it’s much simpler to just add another js file (e.g. test with test1.js, then copy it & rename, and test with test2.js etc).

File:  C:\Windows\System32\inetsrv\config\applicationHost.config

(Unfortunately this did not work for me in a regular application level web.config and it needed to be done at the server level).

image

<httpCompression directory="%SystemDrive%\inetpub\temp\IIS Temporary Compressed Files" noCompressionForHttp10="false" noCompressionForProxies="false">
  
            <scheme name="gzip" dll="%Windir%\system32\inetsrv\gzip.dll" />
            <dynamicTypes>
                <add mimeType="text/*" enabled="true" />
                <add mimeType="message/*" enabled="true" />
                <add mimeType="application/x-javascript" enabled="true" />
                <add mimeType="*/*" enabled="false" />
            </dynamicTypes>
            <staticTypes>
                <add mimeType="text/*" enabled="true" />
                <add mimeType="message/*" enabled="true" />
                <add mimeType="application/x-javascript" enabled="true" />
                <add mimeType="application/atom+xml" enabled="true" />
                <add mimeType="application/xaml+xml" enabled="true" />
                <add mimeType="*/*" enabled="false" />
            </staticTypes>
        </httpCompression>

iisreset

image

 

CloudFront JavaScript Gzip Test

My Origin

https://www.jonkragh.com/starter/v/1.0/foot-complete.js

SNAGHTML138c082a

Cloudfront gzip encoded javascript

https://d2yljticlotdgz.cloudfront.net/starter/v/1.0/foot-complete.js

SNAGHTML137bbb7f

 

CloudFront CSS Gzip Test

Origin

https://www.jonkragh.com/starter/v/1.0/starter.css

SNAGHTML137f09b0

Cloudfront

https://d2yljticlotdgz.cloudfront.net/starter/v/1.0/starter.css

SNAGHTML137e58fd

I’m now enjoying blazing speeds.  Here is an example of Ctrl F5 the same JS file from my server (I am in NJ, my Server is in Denver).

Directly from my origin server

SNAGHTML13a218f8

The same file from CloudFront

SNAGHTML13a2a970

4 Responses to “Amazon CloudFront with IIS7”

  1. Developer news: JMeter, qTrace, betabait, Amazon CloudFront | TechRepublic

    [...] Using Amazon CloudFront to serve CSS and JS from IIS Jon Kragh write a brief article showing how to use the Amazon CloudFront content delivery network (C…. [...]

  2. Fun with Amazon CloudFront and ASP.NET MVC | Delusions of Competence

    [...] one is actually quite well documented on the [...]

  3. Andy

    Great article, just a quick question, I have an autoscaling ec2 config and was wondering if you knew of a way this could be configured when a new EC2 server is launched (without creating a new custom AMI)?

    Many thanks
    Andy

  4. SHAY

    Thanks.

Leave a Reply