はじめに
完全未経験からエンジニア転職を目指しているものです。
今回LINEログインを初めて実装したので、復習がてらまとめていきたいと思います!
環境
- Rails: 7.2.3
- Ruby: 3.3.6
- PostgreSQL: 18
- デプロイ先: Render
補足:- Rails new等の環境構築済みを想定しています。
- 今回は単体での実装のため、Devise等のログイン方法と連動させる方は少しやり方が違います。
LINEログインとは
LINEログインは、LINEアカウントを利用して外部のWebサービスやアプリに簡単に会員登録・ログインできる「ソーシャルログイン」機能です。IDやパスワードを入力する手間が省け、LINEの友だち追加や個人情報を連携させることで、ユーザー・企業双方にメリットがある仕組みです。
ログイン時にメアドやパスワードを使用しなくていいので、ユーザーが手軽に始められるのもいいですね!
今回は、こちらの公式ドキュメントに従って作成していきたいと思います!
LINE Developers設定
まずは、LINE Developers consoleでチャネル作成し、チャネルIDとチャネルシークレットキーを取得します。
Step 1 LINE Developersにログイン
任意のログイン方法で、LINE Developersにログインします。
Step 2 チャネルを作成
プロバイダー名を入力し、チャネル設定画面から、LINEログインをクリック。
各必須項目を入力し作成。
ちなみに各項目の意味はこちら↓
Step 3 コールバックURL登録
LINEログイン設定から、赤枠で囲んでいるウェブアプリでLINEログインを利用するの欄に、URLを設定します。
ここでは、このチャネルで設定したLINEログイン機能を使用するURLを設定します。
- 例
行ごとに読み込んでくれるので、複数設定する場合は必ず行を変えて入力してください!
Step 4 公開設定
チャネル基本設定から、チャネルIDとチャネルシークレットキーをメモしたら、下記画像で赤枠で囲っている公開設定を、公開に変更する。
(これをしないと管理者以外にログイン許可が無いとエラーになります)
これでLINE Developers consoleでの設定は以上!
ここからはRails側の設定をしていきます。
Rails側の設定
Rails側では、必要gemの導入と、ログインに関わるコントローラーの設定、ビューでログインボタンを配置していきます。
Step 1 gemの導入
gem "omniauth-line"
gem "omniauth-rails_csrf_protection"
Gemfileに記述して
docker compose exec web bundle install
でインストールします。
Step 2 Controller設定
ログイン設定をしているControllerで以下の設定を記述。
def create
auth = request.env["omniauth.auth"]
# LINEから渡ってきたprovider("line")とuidを使ってユーザーを探すか作成する
user = User.find_or_create_by!(provider: auth.provider, uid: auth.uid) do |u|
u.name = auth.info.name
u.email = auth.info.email
end
# ログイン状態の保持
session[:user_id] = user.id
cookies.permanent.signed[:user_id] = user.id
# 遷移と通知
redirect_to recipes_path, notice: "LINEでログインしました!"
end
Step 3 View作成(追記)
ログイン画面のViewで以下のように記述。
<%= button_to "/auth/line",
method: :post,
data: { turbo: false },
class: "group relative flex items-center justify-center gap-3 w-full py-4 px-4 bg-[#06C755] border-2 border-[#06C755] rounded-2xl hover:bg-[#05b34c] hover:border-[#05b34c] text-white font-black shadow-sm transition-all hover:shadow-md active:scale-[0.98]" do %>
<%= image_tag "btn_base.png", class: "w-6 h-6" %>
LINEでログイン
<% end %>
LINEのアイコンは、
からダウンロードできます。
Step 4 チャネルID・シークレットキー格納
LINE Developers consoleで作成した、チャネルIDとシークレットキーを格納します。
パターン1 config/credentials.yml.encに暗号化格納
docker compose exec web env EDITOR=vi bin/rails credentials:edit
でvimを開き、下記のように記述する。
line:
channel_id: xxxxxxxxx
channel_secret: xxxxxxxxx
(xxxxxxxxxのところはあなたの取得したキーを入れてください)
次にconfig/initializers/omniauth.rbで
# LINEの設定
Rails.application.config.middleware.use OmniAuth::Builder do
provider :line,
Rails.application.credentials.dig(:line, :channel_id),
Rails.application.credentials.dig(:line, :channel_secret)
と記述し、読み込ませる。
パターン2 ENVに格納
.envに下記のように記述。
LINE_CHANNEL_ID=xxxxxxxxx
LINE_CHANNEL_SECRET=xxxxxxxxx
(xxxxxxxxxのところはあなたの取得したキーを入れてください)
次に、config/initializers/omniauth.rbで
# LINEの設定
Rails.application.config.middleware.use OmniAuth::Builder do
provider :line,
ENV['LINE_CHANNEL_ID'],
ENV['LINE_CHANNEL_SECRET']
のように記述し、読み込ませる。
Railsを再起動して、LINEログインが機能するか確認してみてください!
Render(デプロイ先)の設定
最後に、ENVを使用している場合は、今回のデプロイ先であるRenderへ環境変数を追加しましょう!
読み込ませたい対象のプロジェクトを選び、Environmentから環境変数を追加します。
環境変数は、先ほど「Rails側の設定・Step4」で格納したキーと同じものになるので、タイポ対策でコピペを推奨します!
追加できたら保存してデプロイすれば本番環境での実装も完成です!
[⚠️注意点] emailが nil でも大丈夫?
今回の私の実装では、DBのemailカラムにnull: falseの制約をつけていないため、scope 設定なし(メアドなし)でもログイン可能です。
ただし、Deviseなどで「メールアドレスを必須(null: false)」にしている場合は、以下の対応をしないとログイン時にエラーになります。
対応としては、
1, LINE Developersコンソールで「メールアドレス取得権限」を申請する
チャネル基本設定の最後の方にあるメールアドレス取得権限を申請する。
2, omniauth.rbのscopeにemailを追加する
下記のようにconfig/initializers/omniauth.rbにscopを追加する。
# config/initializers/omniauth.rb
Rails.application.config.middleware.use OmniAuth::Builder do
provider :line,
ENV['LINE_CHANNEL_ID'],
ENV['LINE_CHANNEL_SECRET'],
{
scope: 'profile openid email'
}
end
これで、emailの情報もください!というリクエストが送れます。
自分のアプリのDB設計に合わせて調整してみてください!





