Rails 投稿画像保存(Carriewave&MiniMagic)

【Rails】アイコン画像などをGemを使って保存

ユーザー登録などで画像を保存する方法です。
※該当のモデルにimageという名前でカラムを作成している前提です（データ型：string）

1. Gemのインストール

Gemファイルにcarrierwave(アップロードgem)と、minimagick(画像加工gem)をインストールする。

Gemfile

gem 'mini_magick', '~> 4.8 ' #コメントアウト
gem 'carrierwave  #追加

ターミナルでbundle install

2. ImageMagickをインストール(Cloud9の場合)

minimagickを使うために必要なImageMagickをインストールします。
1.のbundle installで失敗したら、先にこちらのインストールが必要かもしれません。
ターミナルで以下操作をしてインストールします。
sudo apt-get update
sudo apt-get install imagemagick

3. 画像アップローダーの作成

画像のリサイズ設定や、開発環境・本番環境での設定を書くファイルを作成する。
ターミナルrails g uploader image
app/uploadersディレクトリ以下にimage_uploader.rbが作成される。

4. 画像アップローダーを編集（用途に合わせて）

app/uploaders/image_uploader.rb

class ImageUploader < CarrierWave::Uploader::Base
  include CarrierWave::MiniMagick  #（共通）Minimagickをincludeする(関連モデルの取得)
  
  def store_dir  #ファイルの保存場所(デフォは/public/uploads)
    "uploads/#{model.class.to_s.underscore}/#{mounted_as}/#{model.id}"
  end

 def extension_allowlist  #(拡張子許可リスト)
    %w(jpg jpeg gif png)
  end

 def default_url(*args)  #デフォルト画像設定（assets/imagesにdefault.pngで保存）
   "/images/" + [version_name, "default.png"].compact.join('_')
  end

  process resize_to_fit: [200, 200]  #200x200にリサイズ
end

5. 画像アップローダーと関連モデルを関連付け

例としてUserモデルのimageカラムと関連付けします。

model/User.rb

class User < ApplicationRecord
  mount_uploader :image, ImageUploader
end

6. viewにフォームを設置

views/users/show

<%= form_with(model: @user, local: true) do |f| %>
  # name,emailなどのフォーム
  <%= f.label :image, 'アイコン画像' %>
  <%= f.file_field :image, class: 'form-control' %> #file_field：ファイル選択ボックス
  <%= f.submit '登録', class: 'btn btn-primary btn-block' %>
<% end %>

7. controllerで処理

他のカラムと同じでparamsで受取り、保存します。

8. 保存されたデータをviewで表示する

<%= image_tag @user.image.url %>

　完成です！

おまけ(Amazon A3に保存する場合のimage_uploader.rb設定)

(Gemfile)

# production 環境専用の設定
group :production do
  gem 'pg', '>= 0.18', '< 2.0' #PostgreSQLデータベースにアクセスする
  gem 'rails_12factor', '0.0.2'  #RailsアプリケーションをHerokuで動作をさせる
  gem 'fog-aws'  #`fog`のモジュール(AWS用)
end

(app/uploaders/image_uploader.rb)

# CarrierWaveの設定呼び出し
require 'carrierwave/storage/abstract'
require 'carrierwave/storage/file'
require 'carrierwave/storage/fog'

if Rails.env.production? 
    storage :fog  #本番でＳ３に保存
    CarrierWave.configure do |config|
      config.fog_credentials = {
        # Amazon S3用の設定(環境変数ENV[]は.envに設定)
        :provider              => 'AWS',
        :region                => ENV['S3_REGION'],  # S3に設定したリージョン。
        :aws_access_key_id     => ENV['S3_ACCESS_KEY'],
        :aws_secret_access_key => ENV['S3_SECRET_KEY']
      }
      config.fog_directory     =  ENV['S3_BUCKET_KEY']
      config.fog_public = false
    end
  else
    storage :file  #開発時はlocalに保存
  end

S3の使い方については別の記事をご参考にしてください。