掲示板の画像アップロード機能を実装してみた。

今回は、carrierwaveというgemを使用して掲示板のアップロード機能を実装した。この実装を通して学んだこと、忘れそうなことをまとめてみました。

・carrierwaveの特徴

carrierwaveは、railsで画像をアップロードする際によく使われるgemの１つである。大きな特徴として、Uploaderクラスを別に作ることにより、設定１つで色々なモデルと関連付けることができる柔軟性を持っている。

画像アップロード機能を追加したいモデル（今回だとBoard）に、画像用のカラムを追加し、それをUploaderクラスと関連づけることで画像のアップロードが実現できる。

・boardモデルと関連づける

関連付けたいモデルのrbファイルに、以下のコードを記載する

class Board < ApplicationRecord
  mount_uploader :board_image, ImageUploader
# :board_imageは、Boardモデルに新たに作成した画像保存用カラム
end

※ちなみに、上のコードを記載した後にエラーが出る場合がある。その場合は、サーバーを再起動することで自分の場合は直った。

・ビューファイルの画像アップロード用フォーム

<%= f.label :board_image %>
          <%= f.file_field :board_image,accept: 'image/jpg, image/jpeg, image/png, image/gif', class: 'form-control' %>

※今回自分はここのオプションにaccept: を追記してファイル形式を制限したが、carrierwaveを使用している場合は下のように設定するのが普通らしい

image_uploader.rb

  def extension_whitelist
    %w(jpg jpeg gif png)
  end

確かに、もしboardだけでなく複数のモデルに画像アップロード機能を実装する際に、一々全てのビューファイルにaccept: で制限をかけるのはめんどくさい。その点、上の方法だと一発で全部適用できるから、DRYの観点からもこちらの方がいい気がする。

・アップロードした画像を表示する

_board.html.erb

<%= image_tag board.board_image.url, class: "card-img-top" %>

※パーシャルなので@boardではなくboard！流れで実装してたらやりがちな気がする。

・アップロードする画像のサイズを指定する

Image_uploader.rb内の下の２行をコメントアウトする

# include CarrierWave::MiniMagick
# process resize_to_fit: [300, 200]

※minimagickは、画像のリサイズを行うためのgem

・デフォルト画像を設定する

image_uploader.rb内のコードをコメントアウトし、デフォルトで設定したい画像を追記する

def default_url(*_args)
　default.png
end

プログラミング学習　備忘録