アウトプットに時間を使わなきゃと思いつつ中々やらずにいたので、重い腰をあげようかと…
今回は、毎度使っていてあれ？と振り返っていることなので自分が使っていることこちらに書き出してみようと思います。
概要
- ActiveStorageとは
- 導入方法
- 使用方法
- 保存した画像を表示
- 画像加工のツールについて
- 感想
ActiveStorageとは
Active StorageとはAmazon S3、Google Cloud Storage、Microsoft Azure Storageなどの クラウドストレージサービスへのファイルのアップロードや、ファイルをActive Recordオブジェクトにアタッチする機能を提供します。development環境とtest環境向けのローカルディスクベースのサービスを利用できるようになっており、ファイルを下位のサービスにミラーリングしてバックアップや移行に用いることもできます。
アプリケーションでActive Storageを用いることで、ImageMagickで画像のアップロードを変換したり、 PDFやビデオなどの非画像アップロードの画像表現を生成したり、任意のファイルからメタデータを抽出したりできます。
画像アップロード機能が簡単に実装できるGemです。
ActiveStorageはRails5.2から標準で搭載されるようになりました。
導入方法
- Active Record モデルを用意する
まず、導入したいアプリケーションのディレクトリで
rails active_storage:install
rails active_storage:installコマンドを実行すると、Active Storageに関連したマイグレーションが作成されます。
続けてマイグレートします。
rails db:migrate
生成されるテーブルは以下の二つになります。
画像用のカラムを用意する必要がない点もActive Storageの特徴の一つです。
active_storage_blobs
| カラム名 | 保存内容 |
|---|---|
| id | ID |
| key | ファイルを一意に識別するkey |
| filename | アップロードしたファイルの名前 |
| content_type | ファイルの種類 |
| metadata | メタデータ(画像なら縦横の大きさなどが格納される) |
| byte_size | ファイルサイズ(byte単位) |
| checksum | チェックサム |
| created_at | 作成日時 |
###active_storage_attachments
| カラム名 | 保存内容 |
|---|---|
| id | ID |
| name | モデルの属性名(Userモデルのavatarとか) |
| record_type | モデル名(Userとか) |
| record_id | record_typeのモデルのID |
| blob_id | active_storage_blogsのID |
| created_at | 作成日時 |
使用方法
例としてpostテーブルをつかいます。
やることは
- Active Storageのテーブルとpostテーブルのアソシエーションを定義
- post_controller.rbにて、imageカラムの保存を許可
モデルに1つの画像を添付するには、has_one_attachedを使います。
class モデル < ApplicationRecord
has_one_attached :ファイル名
end
has_one_attachedメソッド
各レコードとファイルを1対1の関係で紐づけるメソッドです。
has_one_attachedメソッドを記述したモデルの各レコードは、それぞれ1つのファイルを添付できます。
has_one_attached:ファイル名は、
:photo、:avatar、:hogeなど、ファイルの用途に合わせて好きなものを指定してください。
画像の保存を許可するストロングパラメーター
private
def post_params
params.require(:post).permit(:image).merge(user_id: current_user.id)
end
ストロングパラメーターについて割愛
これでイメージ画像の保存を許可できました。
保存した画像を表示
- image_tagメソッド
img要素を生成するRailsのヘルパーメソッドです。
image_tagメソッドでは、複雑なRailsのディレクトリパスを指定しなくても、モデルから画像ファイルを呼び出して引数に記述するだけで、画像を表示するimg要素を生成します。つまり簡単。
# ファイルをモデルから指定する場合
<%= image_tag モデル.画像ファイル %>
<%= image_tag user.avatar %>
# app/assets/ディレクトリ下の画像ファイルパスでも指定できる
<%= image_tag 画像ファイルのパス %>
<%= image_tag "avatar.png" %>
自談（自分体験談そして余談）
image_tagの存在忘れて一生懸命画像表示しようとしていたw
この場合のpostモデルから引っ張ってもimage自体は他テーブルにあるため、下記のような表示にしかならなかった。
#<ActiveStorage::Attached::One:0x00007f8ba7b765f8>
どうようにしてオプションもある。
<%= image_tag post.image, class: 'post-image' if post.image.attached? %>
attached?メソッド
レコードにファイルが添付されているかどうかで、trueかfalseを返すメソッドです。
モデル.ファイル名.attached?
用途としては必ず画像を表示する記述が読み込まれるため、画像が存在しない場合にはエラーが起きてしまうので、こちらのメソッドを使い
if文を使って工夫することで画像が存在する場合にのみ画像を読み込む記述を読み込まれるようにすることができる。
＊＊クラス属性もつけられます。
画像加工のツールについて
- ImageMagick
- MiniMagick
- ImageProcessing
ImageMagick
コマンドラインから画像に処理を加えることができるツールです。
処理としては、画像の作成やサイズ変更、保存形式の変更などがあります。
ImageMagickはGemではなく、ソフトウェアです。
そのため、Homebrewからインストールします。
GemではないImageMagickをRubyやRailsで扱うには、MiniMagickというGemが必要となります。
brew install imagemagick
こちらは一度入れれば問題ないのですでに入っている場合は、とばしてOK。
MiniMagick
ImageMagickの機能をRubyで扱えるようにしてくれるGemです。
RailsでImageMagickを扱うために必要となります。
ImageProcessing
MiniMagickでは提供できない、画像サイズを調整する機能を提供するGemです。
# Gemfileの一番下に記述する
gem 'mini_magick'
gem 'image_processing', '~> 1.2'
bundle install
gemの更新をしたので、サーバーの立ち上げを忘れずに。
こちらを実装するとvariantメソッドを使用することで、ファイルの表示サイズを指定できます。
モデル.ファイル名.variant(resize: '幅x高さ')
感想
記録として残すつもりで書きました。
最後グダッてしまいましたが、文章力や伝え方について改善点があればコメントお願いします。
他、書いてあることに間違いがあれば申し訳ないです。ご指摘お願いします。
このほかにもS3を使う方法なんかをよく見かけますがこちらは実際に試したあと、追記で残そうかなと思っています。
以上、ありがとうございました。
# 参考URL
https://qiita.com/hmmrjn/items/7cc5e5348755c517458a
https://qiita.com/kimuray/items/3335a87d3488be340374
https://qiita.com/sibakenY/items/e550166970e84d96e16e
https://railsguides.jp/active_storage_overview.html#active-storage%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6