Paperclip :style options not working with s3_direct_upload

Question

Just added the ability to upload directly to Amazon S3 using the gem s3_direct_upload.

Unfortunately, now it's not processing the additional image resizing that I have like this.

:styles => { :thumbnail => "200x200#" }

After looking at the documentation, I haven't been able to find anything that refers to this problem. I also used this tutorial to get every set up correctly. How can I get the image styles to work with a direct_upload to S3??

LOG

Processing by UpdatesController#create as HTML
Parameters: {"utf8"=>"✓", "authenticity_token"=>"fmxSfjg53jcouwmF/fdsoqxmDuq84=", "update"=>{"description"=>"", "direct_upload_url"=>"https://my-bucket.s3.amazonaws.com/uploads%2F1398310463606-c68nyl5gvgkqpvi-3708f19268a140853f118214d98924f8%2Fretro.png", "image_file_name"=>"retro.png", "image_file_size"=>"107715", "image_content_type"=>"image/png", "image_file_path"=>"/uploads%2F1398310463606-c68nyl5gvgkqpvi-3708f19268a140853f118214d98924f8%2Fretro.png"}, "commit"=>"Save changes"}
User Load (1.0ms)  SELECT "users".* FROM "users" WHERE "users"."id" = 29 ORDER BY "users"."id" ASC LIMIT 1

(0.3ms)  BEGIN
Update Exists (0.5ms)  SELECT 1 AS one FROM "updates" WHERE "updates"."id" = 730128 ORDER BY created_at DESC LIMIT 1
SQL (12.2ms)  INSERT INTO "updates" ("created_at", "description", "direct_upload_url", "id", "image_content_type", "image_file_name", "image_file_path", "image_file_size", "updated_at", "user_id") VALUES ($1, $2, $3, $4, $5, $6, $7, $8, $9, $10) RETURNING "id"  [["created_at", Wed, 23 Apr 2014 22:34:29 CDT -05:00], ["description", ""], ["direct_upload_url", "https://my-bucket.s3.amazonaws.com/uploads%2F1398310463606-c68nyl5gvgkqpvi-3708f19268a140853f118214d98924f8%2Fretro.png"], ["id", 730128], ["image_content_type", "image/png"], ["image_file_name", "retro.png"], ["image_file_path", "/uploads%2F1398310463606-c68nyl5gvgkqpvi-3708f19268a140853f118214d98924f8%2Fretro.png"], ["image_file_size", 107715], ["updated_at", Wed, 23 Apr 2014 22:34:29 CDT -05:00], ["user_id", 29]]

Digest::Digest is deprecated; use Digest
[AWS S3 300 .5453 0 retries] copy_object(:bucket_name=>"my-bucket",:copy_source=>"my-bucket/uploads/1398310463606-c68nyl5gvgkqpvi-3708f19268a140853f118214d98924f8/retro.png",:key=>"updates/images/730128/original/retro.png",:metadata_directive=>"COPY",:storage_class=>"STANDARD")  

Digest::Digest is deprecated; use Digest
[AWS S3 543 0.0493 0 retries] delete_object(:bucket_name=>"my-bucket",:key=>"uploads/1398310463606-c68nyl5gvgkqpvi-3708f19268a140853f118214d98924f8/retro.png")

Model

class Update < ActiveRecord::Base
  ...
  ...
  has_attached_file :image, :s3_protocol => :https,
                            :storage => :s3,
                            :styles => { 
                              :profile => "550x330#" },
                            :convert_options => {
                              :thumb => "-quality 75 -strip" },
                            :s3_credentials => "#{Rails.root}/config/aws.yml",
                            :path => ":class/:attachment/:id/:style/:filename",
                            :url => ":s3_domain_url"
  validates_attachment_content_type :image, :content_type => /\Aimage\/.*\Z/

  def self.copy_and_delete(paperclip_file_path, raw_source)
    s3 = AWS::S3.new #create new s3 object
    destination = s3.buckets['bucket-name'].objects[paperclip_file_path]
    sub_source = CGI.unescape(raw_source)
    sub_source.slice!(0) # the attached_file_file_path ends up adding an extra "/" in the beginning. We've removed this.
    source = s3.buckets['bucket-name'].objects["#{sub_source}"]
    source.copy_to(destination) #copy_to is a method originating from the aws-sdk gem. 
    source.delete #delete temp file.
  end

Controller

def create
  if(params[:url])
    @update = Update.new
    render "new" and return
  end

  if(params[:update][:image_file_path])
    @update = current_user.updates.create(update_params)

    respond_to do |format|
      if @update.save
        #we want a destination(paperclip_file_path) and a source(raw_source)
        paperclip_file_path = "updates/images/#{@update.id}/original/#{params[:update][:image_file_name]}"
        raw_source = params[:update][:image_file_path]

        Update.copy_and_delete paperclip_file_path, raw_source #this is where we call a method to copy from temp location to where paperclip expects it to be.
        format.html { redirect_to update_path(:id => @update.id), :flash => { :success => "<strong>Awesome!</strong> You've successfully created your update.".html_safe }}
        format.json { render action: 'show', status: :created, location: @update }
      else
        format.html { render action: 'new' }
        format.json { render json: @update.errors, status: :unprocessable_entity }
      end
    end
  else
    @update = Update.new
    render action: "new", notice: "No file"
  end
end

Answer 1

I see couple of issues in the shared code.

Firstly, you say

Unfortunately, now it's not processing the additional image resizing that I have like this.

:styles => { :thumbnail => "200x200#" }

I don't see any reference to thumbnail style in the actual code of has_attached_file

has_attached_file :image, :s3_protocol => :https,
                            :storage => :s3,
                            :styles => { 
                              :profile => "550x330#" },
                            :convert_options => {
                              :thumb => "-quality 75 -strip" },
                            :s3_credentials => "#{Rails.root}/config/aws.yml",
                            :path => ":class/:attachment/:id/:style/:filename",
                            :url => ":s3_domain_url"

All I see is just one defined style profile as :styles => {:profile => "550x330#" } It should include thumbnail in it.

For example: :styles => { :thumbnail => "200x200#", :profile => "550x330#" }

Next, another issue I see is about convert_options which is currently set as:

:convert_options => { :thumb => "-quality 75 -strip" }

And you don't have any style defined as :thumb. Technically, it should have been either for :profile or for :thumbnail or if you want to apply it to both styles then :all

For example:

:convert_options => { :thumbnail => "-quality 75 -strip" }

-OR-

:convert_options => { :profile => "-quality 75 -strip" } 

-OR-

:convert_options => { :profile => "-quality 85 -strip", :thumbnail => "-quality 75 -strip"  } 

-OR-

:convert_options => { :all => "-quality 75 -strip" } 

Here's an example of how has_attached_file should look like:

has_attached_file :image, :s3_protocol => :https,
                            :storage => :s3,
                            :styles => { 
                              :thumbnail => "200x200#", 
                              :profile => "550x330#" },
                            :convert_options => {
                              :thumbnail => "-quality 75 -strip", 
                              :profile => "-quality 85 -strip" },
                            :s3_credentials => "#{Rails.root}/config/aws.yml",
                            :path => ":class/:attachment/:id/:style/:filename",
                            :url => ":s3_domain_url"

Answer 2

try these codes <%= image_tag @update.image_url, size:"100x100" %>

or <%= image_tag @language.image_url, width: 100, height: 100 %>

or
<%= image_tag(@language.image_url), :style=>'width:100px; height:100px;'%> and edit in your modal as

 class YourModel < ActiveRecord::Base

  has_attached_file :picture, :styles => { :medium => "117x245>", :thumb => "100x100>" }
  validates_attachment_content_type :picture, :content_type => /\Aimage\/.*\Z/

end