CarrierWaveを使った画像の投稿①

CarrierWaveは、ファイルのアップロードを簡単に追加できるgemです。

 

今回、CarrierWaveを用いて、掲示板の画像投稿を実装しました。その実装内容の備忘録です。読者の皆様に少しでも参考になれば幸いです。

 

gemのインストール

Gemfile
gem 'carrierwave'

gemに記載した後、bundle installします。

インストールしたCarrierWaveを読み込むために、必ずサーバーを再起動させましょう。

 

アップローダークラスの生成

CarrierWaveをインストールすることにより、以下のコマンドが実行できます。

bundle exec rails g uploader アップローダー名

今回は、掲示板の画像投稿を行うので、アップローダー名をBoardImageで実行します。

 

コマンドを実行すると、app/uploaders/board_image_uploader.rbというファイルが作られます。

class BoardImageUploader < 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

デフォルトで、storage :fileが指定されています。これは、アップロードしたファイルはpublic/配下に保存されるという意味です。

保存されるディレクトリは、store_dirで設定されます。

 

画像投稿のカラムを追加

次に、board_imageカラムを追加し、ここにアップロード画像の情報を保存します。

$ rails g migration add_board_image_to_boards board_image:string

rails db:migrateを実行すると

class AddBoardImageToBoards < ActiveRecord::Migration[5.2]
def change
add_column :boards, :board_image, :string
end
end

が作成されます。

board_imageカラムには、画像のデータではなく、画像のファイル名が保存されます

理由として、画像のデータを保存してしまうと、データーベースに負荷をかけてしまうからです。

 

controllerのstrong parametersにboard_imageを追加

def board_params
params.require(:board).permit(:title, :body, :board_image)
end

 

アップローダークラスとカラムの紐付け

class Board < ApplicationRecord
mount_uploader :board_image, BoardImageUploader
end

 これで画像をアップロードする際にBoardImageUploaderクラスの設定を利用できるようになります。

 

最後に

CarrierWaveのインストールからアップローダクラスとカラムの紐付けまでみてきました。次回は、実際に画像を掲示板で表示させるところまで実装します。

最後まで読んでいただき、誠にありがとうございました。ブログ内の記載に不備があればコメントいただけると幸いです。