Amazon S3 temporary URL to image works in IE and Firefox but not Safari

Answer 1

I haven't seen this myself - do you maybe have your Safari set up not to download images ?

Answer 2

Your URL is not recognized by AWS:

...attachments%2F30%2Fsmall.png...

It should actually read:

...attachments/30/small.png...

Firefox will replace all URL-encoded entities (prior to the '?' query marker) with their corresponding ASCII representations before actually submitting the request (i.e. Firefox will replace %2F with / in the example above), whereas Safari might not. AWS will likely reply with HTTP 404 to Safari in such circumstances.

Make sure that your URL is well formed for AWS. Study carefully any differences between the URL that Firefox has in its address bar after the image is successfully retrieved, vs. the URL that Safari has in its address bar after the image fails to be retrieved.

Cheers, V.

Answer 3

With a bit of digging around in the S3 library I'm using I have found the problem here.

When you upload a file to S3 you have to set the Content-Type header. In my situation I was uploading two files, one was an original PDF file with a Content-Type of application/pdf, the other was a thumbnail preview in PNG format. The library I was using to upload to S3 does set the Content-Type header, but it was setting the header to application/pdf for both the original PDF and the PNG thumbnail.

It seems that Firefox and IE will happily render a PNG image from S3 even though it has the wrong Content-Type header, whereas Safari doesn't like this at all and consequently won't render the image.

So, patching the S3 library I'm using such that the correct Content-Type header is correctly set on the PNG thumbnails solved the issue.

Phew.