【rails】carrierwaveを使って画像アップロード機能を追加する

はじめに

railsアプリにcarrierwaveを使って画像アップロード機能を追加する方法について

設定方法

まず、Gemfileにcarrierwaveを記載して、bundle installします。

gem 'carrierwave'

続いて、下記コマンドでアップローダーを生成。

$ rails g uploader <カラム名>

$ rails g uploader avatar

生成されたアップローダーに下記の設定をします。

class BoardImageUploader < CarrierWave::Uploader::Base


  def default_url　　※デフォルトの画像、画像がアップロードされなかった場合この画像が表示されるので、ビュー側でif文を書かなくて済む
    sample.jpg
  end

  def extension_whitelist　　※アップロード可能なファイル種別
    %w[jpg jpeg gif png]
  end

end

続いて、アップロード先のフォルダ（/public/uploads）を.gitignoreに登録。

/public/uploads

続いて、該当のテーブルに画像カラムを追加します。

$ rails g migration AddAvatarToUsers avatar:string

$ rails db:migrate

該当のモデルにアップローダーの使用を宣言します。

class User < ApplicationRecord

  mount_uploader :avatar, AvatarUploader

end

続いて、ビューに画像を更新できるようフォームを追加します。

  <div class="form-group">
    <%= f.label :avatar %>
    <%= f.file_field :avatar, class: 'form-control mb-3', accept: 'image/*' %>

    <%= f.hidden_field :avatar_cache %>

  </div>

<%= f.hidden_field :avatar_cache %>は、

もし画像をアップロードして、他のカラムのバリデーションに引っ掛かり更新に失敗した場合に、

一度アップロードした画像をキャッシュしておくためのコードです。

最後に、ストロングパラメータに画像カラムのavatarとavatar_cacheを追加します。

  def user_params
    params.require(:user).permit(:last_name, :first_name, :email, :avator, :avator_cache)
  end