RailsでGravatarを利用して、プロフィールアイコンを設定する方法

✏️️ 2019/10/18 👍️2019/10/18 🔗

プロフィールアイコンが設定されていない場合はGravatarに登録したアイコンを表示するようにします。プロフィールアイコンはActiveStorageでアップロードします。

環境

rails 6.0.0

インストール

gem gravatar_image_tagをインストールします。また、画像処理もしたいので、mini_magickも同時にインストールします。

# Gemfile
gem 'gravatar_image_tag'
gem 'mini_magick'
bundle install

UserModelにプロフィール画像をActive Storageでアップロードする

Active Storageを設定

ActiveStorageをインストールします。

bin/rails active_storage:install

Model

User Modelにavaterをattachします。

# app/models/user.rb
class User < ApplicationRecord
  has_one_attached :avatar
end

Controller

ストロングパラメーターに:avaterを追加します。

def user_params
  params.require(:user).permit(... :avatar ...)
end

View

ユーザ登録フォームにアバターを追加します。

<div class="field">
  <%= form.label :avatar %>
  <%= form.file_field :avatar %>
</div>

アバター画像がActiveStorageでアップロードされている場合はその画像を表示。アップロードされていない場合はGravatarの画像を表示するHelperを作成します。

# app/helpers/application_helper.rb
def user_avatar(user, size = 40)
  if user.avatar.attached?
    user.avatar.variant(resize: "#{size}x#{size}!")
  else
    gravatar_image_url(user.email, size: size)
  end
end

画像を表示したい場所に以下を追加します。

<%= image_tag user_avatar(admin, 100) %>

以上で、RailsでGravatarを利用して、プロフィールアイコンを設定できました。

参考

akito
日本のスタートアップで主にRuby on Railsを使ってプロダクト開発をしています。