2011年8月28日日曜日

rails 画像アップロード paperclipを試してみた

このエントリーをブックマークに追加 このエントリーを含むはてなブックマーク

もう昔から使われている画像アップロードgem paperclipですが試してみました。

以下参照させてもらいました。
gith:https://github.com/thoughtbot/paperclip
参考1http://railscasts.com/episodes/134-paperclip
参考2http://asciicasts.com/episodes/134-paperclip

ruby1.9
rails3.0

準備
・ImageMagickのインストール、設定はここを参照させてもらった
http://www.waydotnet.com/blog/2010/02/rmagick-on-ruby-1-9-1-i386-mingw32-work-d/
ただバージョンはImageMagick-6.7.2-0-Q8-windows-dll.exeを選択した。(特に理由はなし)
※ここでうまくいかなく画像が表示できず苦労した。rubyのバージョンやらImageMagickのバージョンやらがうまく合わないとダメらしい。何回か入れなおしたりしてなんとかうまくいきました。

・テスト用モデル
rails g scaffold product title:string
rake db:migrate


準備終わり、ここからpaperclip
・gemfile記述 インストール
gem 'paperclip'
bundle install

・config/environments/development.rbに以下を追加Paperclip.options[:command_path] = "/usr/local/bin/"

・画像用のいくつかのカラムを追加
rails g paperclip product photo
rake db:migrate

・モデルに以下を記述
class Product < ActiveRecord::Base
   has_attached_file :photo
end

・ビューのproduct/_form.html.erbをアップロードできるように修正
multipartの記述
<%= form_for @product, :html => { :multipart => true } do |f| %>

file_fieldの追加
  <div class="field">
    <%= f.label :photo %><br />
    <%= f.file_field :photo %>
  </div>

・ビューのshowとindexを画像表示できるように以下を追加する
showへの追加
<%= image_tag @product.photo.url %>
indexへの追加
<%= image_tag product.photo.url %>

ここまでで完了。実行して/products/newから画像をアップロードしてみる

















うーん、画像が大きすぎる。のでindexの一覧表示はサムネイルにする。


・モデルに以下を記述、styleのパラメータにsmallのサイズを定義
class Product < ActiveRecord::Base
   has_attached_file :photo, :styles => { :thumb => "50x50>" }
end

これで画像アップロード時にthmbのサイズのサムネイルを用意してくれるらしい
やってみる。(さっきアップロードした画像は一応削除しておく)

・ビューのindexの画像表示部分を修正
<%= image_tag product.photo.url(:thumb) %>

再度、画像をアップロードして確認















コードをちょっと加えるだけで画像アップロードができる。paperclip便利すねえ。
個人的には管理画面用gemのtypusを使っていてpaperclipを使うと
画像アップロードの部分は簡単に設定できるのがいい。



0 件のコメント:

コメントを投稿