CODEWITHSUNDEEP
ruby-on-railsrubyamazon-web-servicesherokuamazon-s3
Lucas Vocos
Lucas Vocos

Reputation: 11

Paperclip, S3, Heroku: Missing Image

Long time viewer, first time asker. I've searched for this topic but don't believe I've found the answer.

I have a Post model that has an image. I'm using the Paperclip gem, saving to Amazon S3, and hosting on Heroku.

The file upload form works fine, because I can see that images are sent to my S3 bucket.

The issue is that, the images don't actually show in production.

Here's my model:

class Post < ActiveRecord::Base
    attr_accessor :image_file_name, :image_content_type, :image_file_size, :image_updated_at
    belongs_to :user
    has_many :reviews

    has_attached_file :image, styles: { medium: "700x500#", small: "350x250>" }
    validates_attachment_content_type :image, content_type: /\Aimage\/.*\Z/

And here's my config/production.rb:

# Required for Paperclip / AWS
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']
    }
}

And here's my show.html.haml file:

.clearfix
    .post_image_description
        = image_tag @post.image.url(:medium)
        .description= simple_format(@post.address)
        .description= simple_format(@post.description)

Shouldn't the @post.image.url be enough? What may I be missing to properly route to the image?

This is what I see when I pull Heroku Logs:

2015-06-23T15:38:26.181383+00:00 app[web.1]: ActionController::RoutingError (No route matches [GET] "/images/medium/missing.png"):

For reference, here's my repository for the project: https://github.com/lucasvocos/pitstop

Please let me know if there is anything else to provide in the question, too. As this is my first time asking. Thanks everyone.

Upvotes: 1

Views: 772

Answers (3)

Judd
Judd

Reputation: 21

I had a similar problem that the upload was working but the display was showing a broken link. I checked the source for the link and it was not pointing to the url shown for the image on S3. I had to add the host name to my paperclip config

  config.paperclip_defaults = {
  :storage => :s3,
  :s3_host_name => 's3-us-west-2.amazonaws.com',
  :s3_credentials => {
    :bucket => ENV['S3_BUCKET_NAME'],
    :access_key_id => ENV['AWS_ACCESS_KEY_ID'],
    :secret_access_key => ENV['AWS_SECRET_ACCESS_KEY']
  }
  }

Upvotes: 2

Papaya Labs
Papaya Labs

Reputation: 1089

You have to commit the missing.png in \public\images\medium.(make sure \public\images\medium\missing.png exist, then commit). This images is the default until you upload some valid image.

However, also is recommended to define the url in model, something like this:

has_attached_file :image, styles: { 
 medium: "700x500#",
 small: "350x250>" }, :url => '/:class/:attachment/:id/:style_:basename.:extension'

Upvotes: 0

Naim Rajiv
Naim Rajiv

Reputation: 3374

You need to set heroku environment variable for s3 bucket variable:

heroku config:set S3_BUCKET_NAME='Your Bucket Name'
heroku config:set AWS_ACCESS_KEY_ID='Your AWS ID'
heroku config:set AWS_SECRET_ACCESS_KEY='Your AWS Secrete Key'

Upvotes: 1

Related Questions