Supabase と GCP で OAuth 認証をセットアップする

アプリのステータスを「本番環境」に設定すると、Google アカウントを持つすべてのユーザーがアプリを利用できるようになる。OAuth 同意画面の審査が通過すると確認ステータスは「検証済み」となる。

実装環境

• Next.js
• Supabase

Google の OAuth 認証をセットアップ

例えば Supabase 等の画面から、Google の OAuth 認証をセットアップするためには、Google Cloud Platform (GCP) から取得した クライアント ID とクライアントシークレットを入力する必要がある。

以下の手順で Google Cloud Platform (GCP) から クライアント ID とクライアントシークレットを取得し、Supabase の設定画面に入力する方法を説明する。

まずは、以下の URL から Google Cloud Platform にアクセスする。

次に API とサービス > 認証情報 > OAuth 2.0 クライアント ID のアプリ名に移動する。

名前を入力したら「承認済みのリダイレクト URI」に、例えば Supabase であれば、Authentication > Privider > Google で表示されている「Callback URL」をコピーして貼り付ける。承認済みのリダイレクト URI とは、以下の解説が書かれている。

設定を保存して、クライアント ID と クライアントシークレット を取得する。

Supabase の設定画面に戻り、取得した クライアント ID と クライアントシークレット を該当のフィールドに入力する。

保存をクリックして設定を完了します。

これで、Supabase を使用して Google の OAuth 認証を利用したサインインが可能となる。Google の認証を利用してサインイン機能をアプリに組み込む際は、Supabase の認証 API を使用する。

アプリ登録の編集

アプリをリリースしたら、公開ステータスを 「アプリを公開」に変更する。

OAuth 同意画面 > アプリを編集

• アプリ名
• ユーザーサポートメール: 連絡が取れる info@アプリのドメイン名 に変更する

アプリのステータスを「本番環境」に設定すると、Google アカウントを持つすべてのユーザーがアプリを利用できるようになる。

ホームページのウェブサイトが登録されていません

Google Cloud Platform (GCP) で、OAuth 同意画面の審査において、確認ステータスが「ホームページのウェブサイトが登録されていません」というエラーが表示される場合は、Google Search Console を通じて、サイトの所有権確認を完了させる必要がある。

その後、Google Trust and Safety チームから 「[Action Needed] OAuth Verification Request Acknowledgement」という題名のメールが届くので、そのメールに「サイトの所有権確認を完了しました」という旨の返信を送信する。

すると、数日後に「アプリ検証リクエストを承認しました。」という返信メールが届き、OAuth 同意画面の審査が通過し、確認ステータスは「検証済み」に変更される。