require() on gzip'd file returning wrong-MIME-type error

Question

Here are my require calls:

    require( ['config'], function( config ) {
        require( ['main'] );
    });

They are pathed to a CDN (AWS S3 + CloudFront) that has gzipped config.js and main.js.

Pertinent parts of my Headers:

Browser:

Accept-Encoding:gzip,deflate,sdch

File:

Content-Encoding:gzip
Content-Type:application/x-gzip

In Safari this works fine. In Chrome and Firefox I get this error:

Resource interpreted as Script but transferred with MIME type application/x-gzip: " http://sample.com/config.js ".

And it never decompresses. I've tried setting scriptType='application/x-gzip' within the require config but that just freezes things.

Any ideas?

Answer 1

The solution is actually quite simple, doh!

On the server side, I had the content-type set to application/x-gzip . This is actually misleading because that is describing the content BEFORE the compression (and thus, AFTER the decompression, as well). The content-encoding is the one that specifies the actual compression step.

To fix, I simply set the content-type on the gzip'd file on the server side to the appropriate type of the original file: text/javascript or text/css , etc.