Paperclip S3 - Can upload images but cannot view them

16
votes

I'm created a Rails app running on Heroku, with Paperclip and S3. I've managed to upload images to my S3 bucket through the site (I can see them show up in my bucket on the Amazon control panel).

But when I add an Image tag i.e. <%= image_tag x.photo.url %>, I get the following html (tags omitted here), with no image displayed!

img alt="Test_tree" src="http://s3.amazonaws.com/hiphotos/ads/photos/000/000/015/original/test_tree.jpg?1344661020"

Please help! Why can't I see the images even though they're in the bucket?

Thanks so much guys

2
ruby-on-railsherokuamazon-s3paperclipamazon
Check my answer – fguillen

2 Answers

18
votes

Create a file a called paperclip initializer:

# config/initializers/paperclip.rb 
# We are actually setting this to 's3_domain_url', 
# so it's not a placeholder for something else. 
Paperclip::Attachment.default_options[:url] = ':s3_domain_url'
Paperclip::Attachment.default_options[:path] = '/:class/:attachment/:id_partition/:style/:filename'

Or you could also place this inside production.rb:

config.paperclip_defaults = {
    :storage => :s3,
    :s3_credentials => {
        :bucket => ENV['S3_BUCKET_NAME'],
        :access_key_id => ENV['AWS_ACCESS_KEY_ID'],
        :secret_access_key => ENV['AWS_SECRET_ACCESS_KEY']
    },
    :url =>':s3_domain_url',
    :path => '/:class/:attachment/:id_partition/:style/:filename',
}
12
votes

Firstly, the url you are trying to use up there in your code is this: 

http://s3.amazonaws.com/hiphotos/ads/photos/000/000/015/original/test_tree.jpg

When you visit that link in the browser, you see the following:

<message>
  The bucket you are attempting to access must be addressed using the specified endpoint. Please send all future requests to this endpoint.
</Message>
<RequestId>810A6AE1D141304C</RequestId>
<Bucket>hiphotos</Bucket>
<HostId>
  XXZ+s+slgZLsRWy5NiU/G0yAKBLftw0oT2dDKpas532qXJEPSrISVPqfZsEgpb2J
</HostId>
<Endpoint>hiphotos.s3.amazonaws.com</Endpoint>

So if we modify the url using the correct endpoint we get this:

http://hiphotos.s3.amazonaws.com/ads/photos/000/000/015/original/test_tree.jpg

Which does return the correct image.

If you are using European buckets, this can happen, and it might be the fault of the gem you are using to push things to s3.

There are loads of articles on how to get Paperclip, S3 and European buckets to play nicely together.

I have found though, that since I started using the asset_sync gem, which uses Fog instead of aws-s3 gem, I don't have any more trouble with paperclip and S3.

So I suspect Fog has something to do with making this problem go away for me. I'd recommend switching to it, if you're using something else.