本番環境で、外部APIを用いたログインがエラーになった話(Facebook API、Google API)

開発環境

Mac OS Catalina 10.15.7
ruby 2.6系
rails 6.0系

前提

• 外部APIを用いたログインは、omniauthとomniauth-rails_csrf_protectionを用いて実装しました。
• 記事投稿方のアプリに外部API(Facebook、Google)を用いたログイン機能を実装(ローカルの挙動は問題なし)
• EC2にデプロイ済み
• Route53で名前解決済み(ドメインはお名前ドットコムで取得しました)

ことの発端

本番環境にデプロイが成功した後、アプリの挙動を試していると外部APIを用いたログイン機能が使えない事態が発生しました。

Facebookのエラー画面

Googleのエラー画面

解決策

結論から書くと、リダイレクトURIを正しく設定できていないことが原因でした。
そのため、解決策としては以下の通りです。

Facebookの場合

Facebook for Developersにアクセスして、 「Facebookログイン」>「設定」 の中にある
「有効なOAuthリダイレクトURI」というフォームに
自身のアプリのURL/users/auth/facebook/callback
を追加する。

Googleの場合

Google Cloud Platformにアクセスして、　「APIとサービス」>「認証情報」 の中にある、「承認済みのリダイレクト URI」に
自身のアプリのURL/users/auth/google_oauth2/callback
を追加する。

以上です。参考になれば幸いです。