How to serve gzipped assets from Amazon S3

Question

I am currently serving all of my static assets from Amazon S3. I would like to begin using gzipped components. I have gzipped and confirmed that Amazon is setting the correct headers. However, the styles are not loading.

I am new to gzipping components, so possibly I am missing something? I can't find too much information about this with Amazon S3.

Answer 1

For future reference to anyone else with this problem:

Gzip your components. Then remove the .gz extension leaving only the .css or .js extension. Upload the files to your bucket.

From your S3 dashboard, pull up the properties for the file that you just uploaded. Under the 'Metadata' header enter this information:

'content-type'      :  'text/css' or 'text/javascript'
'content-encoding'  :  'gzip'

These value options are not available by default (wtf) so you must manually type them.

Answer 2

I also found a solution how to do it using CLI, very useful when working with multiple files:

aws s3api put-object \ 
  --bucket YOUR_BUCKET \ 
  --key REMOTE_FILE.json \ 
  --content-encoding gzip \
  --content-type application/json \ 
  --body LOCAL_FILE.json.gz 

Notes:

• Set content-type approppriately to what you're uploading
• The file name on the server doesn't need to have the .gz extension