ぞえの技術めも

Ruby on Rails勉強中

【158日目】【1日20分のRailsチュートリアル】【第11章】画像アップロードの準備

Ruby on Railsチュートリアル(第3版)

今日は「11.4 マイクロポストの画像投稿」から。

11.4 マイクロポストの画像投稿

この節では、応用編として画像付きマイクロポストを投稿できるようにしてみます。

ほへー。画像も扱うのか…!

投稿された画像ってどこに保存するんだろう。

11.4.1 基本的な画像アップロード

投稿した画像を扱ったり、その画像をMicropostモデルと関連付けするために、今回はCarrierWaveという画像アップローダーを使います。まずはcarrierwave gemをGemfileに追加しましょう (リスト11.55)。

なるほど、画像を扱うためのgemがあってそれを使うのか…!色んなものあるね

Gemfile

gem 'carrierwave',             '0.10.0'
gem 'mini_magick',             '3.8.0'
gem 'fog',                     '1.36.0'

あとで必要になるmini_magick gemとfog gemsも含めている点に注目してください。これらのgemは画像をリサイズしたり (11.4.3)、本番環境で画像をアップロードする (11.4.4) ために使います。

色んなものあるね

いつものようにインストールします。

インストールしましょう。

$ bundle install
  :
Bundle complete! 26 Gemfile dependencies, 116 gems now installed.
Gems in the group production were not installed.
Use `bundle show [gemname]` to see where a bundled gem is installed.

なんか関連するgemがいっぱいインストールされた。

CarrierWaveを導入すると、Railsのジェネレーターで画像アップローダーが生成できるようになります。早速、次のコマンドを実行してみましょう (画像のことをimageとすると一般的過ぎるので、今回はpictureと呼ぶことにします) 。

imageとpictureの違い分かってないや…まぁいっか。。。。

$ rails generate uploader Picture
      create  app/uploaders/picture_uploader.rb

CarrierWaveでアップロードされた画像は、Active Recordモデルの属性と関連付けされているべきです。関連付けされる属性には画像のファイル名が格納されるため、String型にしておきます。(図11.19)

ふむふむ。データベースには画像のファイル名を格納して関連付けるのか。

必要となるpicture属性をMicropostモデルに追加するために、マイグレーションファイルを生成し、開発環境のデータベースに適用します。

マイグレーションしてデータベースを更新。

$ rails generate migration add_picture_to_microposts picture:string
      invoke  active_record
      create    db/migrate/20170629020527_add_picture_to_microposts.rb
$ bundle exec rake db:migrate
  :
== 20170629020527 AddPictureToMicroposts: migrating ===========================
-- add_column(:microposts, :picture, :string)
   -> 0.0005s
== 20170629020527 AddPictureToMicroposts: migrated (0.0006s) ==================

Micropostモデルにアップローダーを追加した結果をリスト11.56に示します。

Micropostモデルにアップローダーを追加。

app/models/micropost.rb

  :
  mount_uploader :picture, PictureUploader
  :

システムによっては、ここで一旦Railsサーバーを再起動させる必要があります。再起動させたらテストスイートを走らせてみてください。成功しているはずです。

今日はサーバーを起動させてないのでそのままテスト実行で大丈夫かな。

$ bundle exec rake test
59 tests, 306 assertions, 0 failures, 0 errors, 0 skips

うん、大丈夫でした。

項の途中だけど今日はここまで。

今日の学習時間は【20分】

次は「11.4.1 基本的な画像アップロード」のHomeページ上にアップローダーを追加するところから。