carrierwaveを使った画像アップロード機能の実装

最近はRailsをさわっています。
そこでcarrierwaveを使用した画像アップロード機能を実装したのでメモ。scaffolding機能で基本的な部分は実装されていることを前提として話を勧めます。

まずはgemをアプリケーションに追加します。

gem 'carrierwave'

bundle installしましょう。gemのインストールです。

bundle install

実は「bundle」だけでもbundle installされるんですね（最近知りました）。よく打つコマンドなので簡略化してもいいかもしれません。

carrierwaveではuploaderというジェネレータが生成されるので、以下のコマンドで作成してしまいます。

rails generate uploader image

コマンドを実行することで、images_uploader.rbが生成されます。設定に必要な記述がコメントアウトされた状態で用意されていますので、必要になった際にはコメントを削除しましょう。
なお、保存するファイルは今回の場合、public/uploads/images以下に保存されます。

既存のテーブルに列を追加します。私の環境ではimagesテーブルへ追加するため、以下のようなコマンドになります。

rails generate migration add_image_to_images image:string

String型ってことに注意しておいてください。rake db:migrateもお忘れなく。

Imagesテーブルにimage列を追加したので、コントローラからもアクセスできるよう、Imagesモデルにアップローダを追加します。

class Image < ActiveRecord::Base
  attr_accessible :image,:id,:title,:author,:date
  mount_uploader :image , ImageUploader
end

2行目は「:image」を追加、3行目はアップローダの追加になります。2行目には全ての列を追加していないとエラーが出ますので、エラーが出た際にはその記述に従って列を追加していってください。

次にフォームヘルパーへアップロードファイルのフィールドを追加しましょう。:htmlオプションを設定することが必須になりますので注意してください。

<%= form_for @image,<span class="deco" style="font-weight:bold;">:html => {:multipoint => true}</span> do |f| %>
  <% if @image.errors.any? %>
    <div id="error_explanation">
      <h2><%= pluralize(@image.errors.count, "error") %> prohibited this image from being saved:</h2>
      <ul>
      <% @image.errors.full_messages.each do |msg| %>
        <li><%= msg %></li>
      <% end %>
      </ul>
    </div>
  <% end %>

  <div class="field">
    <%= f.label :id %><br />
    <%= f.text_field :id %>
  </div>
<span class="deco" style="font-weight:bold;"><div class="field">
    <%= f.label :image %><br />
    <%= f.file_field :image %>
  </div></span>
 
  <div class="actions">
    <%= f.submit %>
  </div>
<% end %>

次はshowテンプレートから画像が参照できるようにしましょう。

<p>
  <b>Image:</b>
  <%= image_tag @image.image_url.to_s %>
</p>

これでフォームで追加した添付ファイルをhoge/showで確認することができたと思います。
次回はrmagickを使ったサムネイル生成を取り上げたいと思います。