0
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

CarrierWave複数画像のアップロード

Last updated at Posted at 2020-06-10

#前提
carrierwave用のカラム image:stringがある状態

teminal
$ rails g model Post title:string body:text image:string
$ rails db:migrate

#実装

###Gemインストール

Gemfile
gem 'carrierwave'
terminal
$ bundle install

###CarrierWaveのアップローダー作成

terminal
$ rails g uploader image

app/uploaders/image_uploader.rb に下記ファイルが作成される。

image_uploader.rb
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

  # Provide a default URL as a default if there hasn't been a file uploaded:
  # def default_url(*args)
  #   # For Rails 3.1+ asset pipeline compatibility:
  #   # ActionController::Base.helpers.asset_path("fallback/" + [version_name, "default.png"].compact.join('_'))
  #
  #   "/images/fallback/" + [version_name, "default.png"].compact.join('_')
  # end

  # Process files as they are uploaded:
  # process scale: [200, 300]
  #
  # def scale(width, height)
  #   # do something
  # end

  # Create different versions of your uploaded files:
  # version :thumb do
  #   process resize_to_fit: [50, 50]
  # end

  # Add a white list of extensions which are allowed to be uploaded.
  # For images you might use something like this:
  # def extension_whitelist
  #   %w(jpg jpeg gif png)
  # end

  # Override the filename of the uploaded files:
  # Avoid using model.id or version_name here, see uploader/store.rb for details.
  # def filename
  #   "something.jpg" if original_filename
  # end
end

Postモデルに先ほど作成したImageUploaderと紐付け。

post.rb
  # 追加
  mount_uploaders :image, ImageUploader
  serialize :image, JSON

####controllerの編集
ストロングパラメーターに複数ファイルのアップロード属性を許可する

posts_controller.rb
  def post_params
    params.require(:post).permit(:title, :body, { image: [] })
  end

####viewの編集
複数枚選択できるようにする。

new.html.erb
 #追加 multiple: true
 <%= f.file_field :image, multiple: true %>

最後に複数枚表示できるようにする。

index.html.erb
 <% @post.image.each do |image| %>
   <%= image_tag(image.url) %>
 <% end %>
0
4
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?