ActiveStorageを使用して画像を保存、表示させる

※ただのアウトプットノート感覚で使っています。

ActiveStorageを導入する

$ rails active_storage:install

このコマンドを使用するとactive_storage_blobs とactive_storage_attachments
といった二つのテーブルが作成されたマイグレーションファイルができある
出来上がったマイグレーションファイルを確認できたら

rails db:migrate

を実行する。

modelに対してActiveStorageの設定をする

user.rbにActive Storageを設定する例でやっていきます。カラムの名前はavatarでいきます。

まず一つの画像ファイルを保存したい場合の記述は

has_one_attached :avatar

と書きます。次に複数の画像ファイルを保存したい場合の記述は

has_many_attached :avatar

と記述します。

次に画像を保存できるようにする。

ここではdeviseを使用する例でいきます。


<%= form_for(resource, as: resource_name, url: registration_path(resource_name), html: { method: :put }) do |f| %>
 <%= render "devise/shared/error_messages", resource: resource %>

この中に下記を追加します。

<div class="field">
 <%= f.label :avatar, "プロフィール画像" %><br/>
 <%= f.file_field :avatar %>
</div>

上記のコードを書くことで簡単に保存フィールドが出来上がリマス。

保存した画像をviewで表示させる

表示させたいviewファイルに画像を表示させるコードを書いていきます

<%= image_tag user.avatar %>

僕はこのコードで表示できずエラーなりました。
なので書き方を変えてこのコードで表示に成功することができました。

<%= image_tag(url_for(@user.avatar)) %>

今気づいたのですがもしかしたら一行目のコードはインスタンス変数を使用していないから表示されてないのでは？と気づきましたがまた後日確認してみます(笑)
もしかしたら一行目も@user.avatarとすれば表示できるかもしれませんね！
さすが初心者の僕ですね！！

おしまい。