A.N
A.N

Reputation: 11

Carrierwave image uploading not working

I am trying to upload a logo image to Amazon s3 bucket using carrierwave through rails application. but my file upload is not reading file as HTTP file and adds NULL to the database. I am unable to figure out what is wrong with my code.

Here is my model

class StoreLocation < ActiveRecord::Base
  mount_uploader :logo_url, ImageUploader
  ...
end

My ImageUploader

require 'carrierwave/orm/activerecord'
class ImageUploader < CarrierWave::Uploader::Base

 # Include RMagick or MiniMagick support:
 # include CarrierWave::RMagick
 # include CarrierWave::MiniMagick

  # Choose what kind of storage to use for this uploader:
  #storage :file
  storage :fog

  # Override the directory where uploaded files will be stored.
  # This is a sensible default for uploaders that are meant to be mounted:
  def store_dir
    "uploads/#{model.class.to_s.underscore}/#{mounted_as}/#{model.id}"
  end

  def cache_dir
    # "#{Rails.root}/tmp/uploads"
    Rails.root.join 'tmp/uploads'
  end
  # Add a white list of extensions which are allowed to be uploaded.
  # For images you might use something like this:
  def extension_white_list
    %w(jpg jpeg gif png)
  end

end

snippet from my store_location/new.html.erb

<div>
          <input id="picholder" type="file" name = "store_location[logo_url]" style = "width: 0px;">
          <img id="storeLogo" src="/assets/Picupload_bg.png" alt="storeLogo" class = "small_thumb"/>
          <img src="/assets/brws.png" id="brws_logo_file" class = "brws_btn">
        </div>

and my javascript store_location.js to read file.

$(document).on('ready page:load', function () {
  jQuery.validator.addMethod("lettersonly", function(value, element) {
        return this.optional(element) || /^[A-Za-z ]+$/i.test(value);
    }, " ");

function readURLImage(filePath) {
  if (filePath.files && filePath.files[0]) {
    var reader = new FileReader();        
    reader.onload = function (e) {
        $('#storeLogo').attr('src', e.target.result);
    }
    reader.readAsDataURL(filePath.files[0]);
  }
}

$("#picholder").change(function(){
    readURLImage(this);
  });

$("#brws_logo_file").click(function () {
    $("#picholder").trigger('click');
  });

});

when I run this, I can see thumbnail image on form on selection of any image file, but parameters in requests are like following: (From rails log)

Parameters: {"utf8"=>"✓", "authenticity_token"=>"Q0ejEHG2uzPlSlJ2XF8eC7uVXWs76jtEGfXRNCHgyuc=", "store_location"=>{"store_name"=>"Origins", "first_address"=>"Gulberg", "second_address"=>"", "country"=>"Pakistan", "state"=>"Punjab", "city"=>"Lahore", "zip_code"=>"54000", "phone_no"=>"111674446", "logo_url"=>"b3.jpg"}, "commit"=>"Submit"}
INSERT INTO `store_locations` (`city`, `country`, `created_at`, `first_address`, `logo_url`, `phone_no`, `second_address`, `state`, `store_name`, `updated_at`, `user_id`, `zip_code`) VALUES ('Lahore', 'Pakistan', '2014-12-10 10:33:37', 'Gulberg', NULL, '111674446', '', 'Punjab', 'Origins', '2014-12-10 10:33:37', 1, '54000')

I am unable to understand why logo_url is coming just as file name, where as it should be like

 "logo_url"=>#<ActionDispatch::Http::UploadedFile:0x00000009b07c88 @tempfile=#<Tempfile:/tmp/RackMultipart20141209-15502-1q6mzyf>, @original_filename="b3.jpg", @content_type="image/jpeg", @headers="Content-Disposition: form-data; name=\"store_location[logo_url]\"; filename=\"b3.jpg\"\r\nContent-Type: image/jpeg\r\n">

Any help in this regard would be appreciated. Thank You.

Upvotes: 1

Views: 550

Answers (1)

Oss
Oss

Reputation: 4322

By default Carrierwave has a method which is column_name + _url for uploading remote images in a certain column.

For example:

user.logo_url('http://www.example.com/example.png') will save this image in the logo column in the user model.

Rename your column from logo_url to logo in order to upload the image directly and not start HTTP request.

Upvotes: 1

Related Questions