箱のプログラミング日記。

渋谷の自社開発企業でRails書いてます。

carrierwaveで複数画像投稿【Rails】

f:id:y_hakoiri:20191102134313j:plain

レビューサイト作成にあたり画像の複数投稿を実装したので

carrierwaveの使い方を買いておこうと思います。

 

①gemをインストール

gem 'carrierwave'
gem 'mini_magick'

$ bundle install

 

今回はmini_magickを使って画像の加工(リサイズなど)も実現したいので

併せてインストールしておく。

 

②モデルの生成

$ bundle exec rails g model image

 

レビューサイトなので別でreviewsモデルがすでにありますが、

今回は画像を複数投稿できるようにしたく、

reviewsモデルにimage1,image2...とカラムが増えていくのは非効率なので

別途画像のみのモデルを作成します。

 

db/migrate/一番下のファイル

class CreateImages < ActiveRecord::Migration[5.2]
 def change
  create_table :images do |t|
   t.integer :review_id
   t.text :url
   t.timestamps
  end
 end
end

モデルを作成すると新しいマイグレーションファイルが出来上がるので、上のように編集

 t.integer :review_id
 t.text :url

 

マイグレーションファイルが編集できたら、$bundle exec rake db:migrate

 

https://i.gyazo.com/7a9af24ddcfa4bf6a1a5b6a8a1372213.png

 このようなテーブルが出来上がる

(created_atとupdated_atはデフォルトで記述されているt.timestampsによって生成されたもの)

 

 

③アップローダーの作成

bundle exec rails g uploader image

※imageはアップローダーのファイル名にあたるものなので任意。

モデルやカラムと紐づけておくと分かりやすい

 

この「アップローダー」が何なのか理解できず色々調べたものの、

分かりやすく詳しく解説してある記事がなかなか見つけられず。

 

とりあえず、画像をアップロードするために必要なファイルなんだな、ということだけは理解。

このコマンドによりapp/uploadersディレクトリ、およびその配下にimage_uploader.rbが生成されます。

 

④image_uploader.rbの編集

生成されたimage_uploader.rbを見ると、すでに色々記述してある。

mini-magickを併用する場合は上から4行目あたりにある

include CarrierWave::MiniMagick

この部分のコメントアウトを外しておく。

process resize_to_fit: [400, 400]

画像をリサイズさせたい場合はこちらも記述。 

 

⑤モデルにマウントする

class Image < ApplicationRecord
mount_uploader :image, ImageUploader
end

imageモデルをこのように編集。

 これによりモデルとアップローダーを繋げることができる

※既にあるモデルにimageカラムを追加した場合は、そのモデル に追記

 

とりあえず今日はここまで。

明日以降また実装を続けるので、さらに理解が深まったらまた更新します。