GitHub を使用してソーシャルログインを設定する

GitHub ソーシャルサインインのための公式 Logto コネクター。

ヒント:

このガイドは、Logto コネクターについての基本的な理解があることを前提としています。未経験の方は、コネクター ガイドを参照して始めてください。

始める

GitHub コネクターを使用すると、エンドユーザーは GitHub OAuth 2.0 認証 (Authentication) プロトコルを介して自分の GitHub アカウントを使用してアプリケーションにサインインできます。

GitHub アカウントでサインインする

GitHub ウェブサイト にアクセスし、GitHub アカウントでサインインします。アカウントをお持ちでない場合は、新しいアカウントを登録することができます。

OAuth アプリを作成して設定する

OAuth アプリの作成 ガイドに従って、新しいアプリケーションを登録します。

Application name に新しい OAuth アプリケーションの名前を付け、アプリの Homepage URL を入力します。Application description フィールドは空白のままにして、Authorization callback URL を ${your_logto_origin}/callback/${connector_id} にカスタマイズできます。connector_id は Logto Admin Console のコネクター詳細ページの上部バーにあります。

注記:

ログイン時に「The redirect_uri MUST match the registered callback URL for this application.」というエラーメッセージが表示された場合は、GitHub OAuth アプリの Authorization Callback URL と Logto アプリのリダイレクト URL を一致させることで問題を解決してください（もちろん、プロトコルも含めて）。

Enable Device Flow の前のチェックボックスをチェックしないことをお勧めします。そうしないと、モバイルデバイスで GitHub にサインインするユーザーは、GitHub アプリで最初のサインインアクションを確認する必要があります。多くの GitHub ユーザーは、携帯電話に GitHub モバイルアプリをインストールしていないため、サインインフローがブロックされる可能性があります。エンドユーザーがサインインフローを確認することを期待している場合は、この提案を無視してください。デバイスフロー の詳細を参照してください。

OAuth アプリの管理

OAuth アプリページ にアクセスすると、既存の OAuth アプリを追加、編集、または削除できます。 また、OAuth アプリの詳細ページで Client ID を見つけたり、Client secrets を生成したりすることもできます。

コネクターを設定する

前のセクションで説明した OAuth アプリの詳細ページから取得した Client ID と Client Secret を clientId と clientSecret フィールドに入力します。

scope は、スペースで区切られた スコープ のリストです。指定しない場合、スコープはデフォルトで read:user になります。

設定タイプ

名前	タイプ
clientId	string
clientSecret	string
scope	string

GitHub コネクターをテストする

これで完了です。GitHub コネクターが利用可能になったはずです。サインイン体験でソーシャルコネクターを有効にする のを忘れないでください。

参考

GitHub - 開発者 - アプリ

GitHub - 開発者 - アプリ - OAuth アプリの作成