I have a Rails app on a staging server that is using Cloudfront as a cdn for images in an S3 bucket. The images in the bucket are all jpegs (not gzipped). If I load an image directly from the bucket I can see in its Response Headers that Content Type is set toimage/svg+xml.
The Cloudfront distribution has a single behaviour and compression is switched off:
Compress Objects Automatically: Unchecked
However there is an issue with loading images on the site.
If the requested image is below 1mb the request succeeds, with the Response headers (pertinent headers in bold):
accept-ranges:bytes
age:12058
cache-control:max-age=29030400
content-length:22749
content-type:image/jpeg
date:Fri, 03 Nov 2017 07:35:39 GMT
etag:"5391a06cfff89879e57da305a21e3e4c"
last-modified:Tue, 29 Nov 2016 11:14:53 GMT
server:AmazonS3
status:200
via:1.1 1b61c3f085e80ef7e1cd6e9ac0cdfa77.cloudfront.net (CloudFront)
x-amz-cf-id:1-YfXx6B_px2YlEK7b96chYcC2AfZ_QMd42NpcilQcXhr63gpJ4_uQ==
x-cache:Hit from cloudfront
However if the requested image is above 1mb, the request succeeds, but the image isn't displayed. The headers show that the response encoding is gzip.
age:12712
**content-encoding:gzip**
**content-type:text/html; charset=utf-8**
date:Fri, 03 Nov 2017 07:12:08 GMT
server:Cowboy
status:200 OK
status:200
vary:Accept-Encoding
via:1.1 vegur, 1.1 adc13b6ff82fd04caa2efba65479257c.cloudfront.net (CloudFront)
x-amz-cf-id:_CLNU7iKqnFF1kTNFRJVfrv4iTh8nzol1smRg73p8zESaZo96NZ2gA==
x-cache:Hit from cloudfront
x-content-type-options:nosniff
x-frame-options:SAMEORIGIN
x-request-id:eac71856-51b8-4b11-80eb-95e2b4c5bb37
x-runtime:0.022798
x-xss-protection:1; mode=block
Why is Cloudfront gzipping the images, and why are the gzipped images failing to render to the screen? As far as I understand it, there is no point gzipping images, but they should still be rendered.
