パート5：Google Oauth
概要
SupabaseアプリケーションにGoogle OAuthログインを追加する方法を解説します。
視聴
外部のOAuthプロバイダでログインする
Google, GitHub, Facebookなどのソーシャル・ログインと接続するのはとても簡単です。このガイドでは、Googleに接続する手順を説明します。基本的にはazure, bitbucket, github, gitlab, facebook, googleを含むすべてのプロバイダーで同じ手順になります。
まず、Googleのクラウド・コンソール内にGoogleプロジェクトを作成する必要があります。他のプロバイダーでは、これを「アプリ」と呼ぶことがあり、通常はそれぞれのプロバイダーの開発者ポータルで利用できます。
プロジェクトを作成したら、検索バーに「OAuth」と入力し、「OAuth同意画面（OAuth content screen）」を開きます。
「外部（External）」を選択して、残りのフォーム・フィールドの入力を進めます。
次に、左側の「認証情報（Credentials）」ページを開きます。
「認証情報を作成（CREATE CREDENTIALS）」をクリックし、選択肢から「OAuthクライアントID（OAuth client ID）」を選択します。
「ウェブアプリケーション」を選択します。「承認済みのリダイレクトURI（Authorized redirect URIs）」セクションにhttps://<自身のを参照>.supabase.co/auth/v1/callbackを追加します。SupabaseのURLは、Supabaseのダッシュボード内のSettings → APIで確認できます。
ポップアップからクライアントID（Your Client ID）とシークレット（Your Client Secret）を取得します。SupabaseダッシュボードのAuth → Settingsにあるgoogleセクションへ挿入します。
保存します。これで、ブラウザーで以下の場所へ移動できるようになります。
https://<自身のを参照>.supabase.co/auth/v1/authorize?provider=google
そして、googleやgmailのアカウントを使って、あなたのサービスにログインしてください。
例えば、URLの最後にredirect_to=というクエリパラメーターを追加できます。
https://<自身のを参照>.supabase.co/auth/v1/authorize?provider=google&redirect_to=http://localhost:3000/welcome
SupabaseダッシュボードのAuth → Settingsページで入力したサイトURLを確認してください。ここで入力したURLが、同じホスト上にある必要があります（近日中に、許可リストへさらにURLを追加できる機能が追加される予定です）。
認証に成功した後、ユーザーをウェブサイトやアプリ内の特定のページにリダイレクトできます。
また、oauthプロバイダーに追加のスコープを要求できます。例えば、ユーザーのgmailアカウントに代わってメールを送信する機能が必要な場合、次のようなクエリパラメータのscopesを追加することで実現できます。
https://<自身のを参照>.supabase.co/auth/v1/authorize?provider=google&https://www.googleapis.com/auth/gmail.send
ただし、このような高度なスコープを要求するには、通常、アプリケーションをGoogleに認証してもらう必要があることに注意してください。
あとはUIを実装するだけですが、あらかじめ用意されているものを使いたい場合は、便利な認証ウィジェットを用意していますので、サポートしたい認証プロバイダーを有効/無効にしたりできます。
サポートが必要な場合は、beta at supabase.comまでご連絡ください。また、機能リクエストについては、バックエンドまたはフロントエンドのリポジトリーでissueを開いてください。
リソース
- JWTデバッガー：https://jwt.io/
次のステップ
- パート1：JWTをみる
- パート2：行単位セキュリティーをみる
- パート3：ポリシーをみる
- パート4：GoTrueをみる
- Supabaseにサインアップ：app.supabase.com