よく知られたOpenID Connect プロバイダーの設定

GitHub の OIDC を設定するには、 GitHub developer settings で新しい OAuth アプリケーションを作成する必要があります。

詳細を適切に入力する必要がありますが、さらに重要なのは、Authorization Callback URL を http://localhost:8080/_renarde/security/github-success に設定することです (Quarkus DEV モードを使用してテストする場合)。

次に、 Register application をクリックすると、アプリケーションページが表示されます。

Generate a new client secret をクリックし、クレデンシャルを確認して、Client ID と Client Secret を書き留める必要があります (特に Client Secret は、後でこのページで再度見ることができないため、書き留めてください。ただし、いつでも再作成できますので、心配しすぎる必要はありません)。

次に、以下の設定を application.properties に追加します。

OIDC for Google を設定するには、 Google Cloud Platform console で新しいプロジェクトを作成する必要があります。

プロジェクト名を選択し、 CREATE をクリックします。

次に、トップセレクターでプロジェクトを選択し、左側のメニューバーから APIs and Services > OAuth consent screen をクリックします。

External を選択して、Google ユーザーがアプリケーションにログインすることを許可し、 CREATE を押します。

これで、アプリケーション名、サポートメール、開発者の連絡先情報を入力して、 SAVE AND CONTINUE を押すことができます。

次のページにスコープを追加せずに、 SAVE AND CONTINUE を押します。

次のページにテストユーザーを追加せずに、 SAVE AND CONTINUE を押します。

トップメニューの CREATE CREDENTIALS > OAuth client ID をクリックします。

Application type として Web application を選択し、 Authorised redirect URIs リストに http://localhost:8080/_renarde/security/oidc-success を追加して、 CREATE を押します。

Client ID と Client Secret をコピーします。

これで、 application.properties を設定できます。

Microsoft 用の OIDC をセットアップするには、 Microsoft Azure Portal にアクセスし、 Azure Active Directory を検索してクリックする必要があります。

そこで、左側の Manage の下にある App registrations をクリックしてから、 New registration をクリックします。

アプリケーション名を入力し、 Accounts in any organizational directory (Any Azure AD directory - Multitenant) and personal Microsoft accounts (e.g. Skype, Xbox) を選択して誰でもログインできるようにし、 Web Redirect URI を http://localhost:8080/_renarde/security/oidc-success として追加してから Register をクリックします。

その結果のページで、 Client Id (Application (client) ID の下) をコピーしてから、 Add a certificate or secret をクリックします。

次に、 Client secrets (0) の下にある New client secret をクリックします。

何も変更せずに、そのダイアログで Add をクリックします。

結果のページで、 Secret ID をコピーします。

これで、 application.properties を設定できます。

Apple 用の OIDC を設定するには、開発者アカウントを作成し、99 ユーロ/年のプログラムにサインアップする必要がありますが、他のほとんどの OIDC プロバイダーのように localhost でアプリケーションをテストすることはできません。 https で実行して公開する必要があるため、開発目的では https://ngrok.com などのサービスを使用することをお勧めします。

Create a new identifier にアクセスして + を押します

何も触れないで、 App IDs を選択したまま Continue を押します。

何も触れないで、 App を選択したまま Continue を押します。

説明とバンドル ID を入力します (アプリケーションパッケージ名を使用します)。

次に、下にスクロールして Sign in with Apple 機能を見つけ、それを選択して、 Continue を押します。

アプリ ID 接頭辞を書き留めてから、 Register を押します。

Identifiers ページに戻り、 + を押します。

Service IDs を選択し、 Continue を押します。

説明とバンドル ID を入力 (アプリケーションパッケージ名を使用) し、 Continue を押します。

次に、 Register を押します。

サービスリストに戻り、新しく作成したサービスをクリックします。

Sign in with Apple を有効にして、 Configure を押します。

ドメインを追加して URL (<host>/_renarde/security/oidc-success に設定) を返し、 Next を押します。

次に Done を押します。

続いて Continue を押します。

そして、 Save を押します。

左側のメニューの Keys ページに移動し、 + を押します。

キー名を入力し、 Sign in with Apple を有効にして、 Configure を押します。

Primary App ID を選択し、 Save を押します。

キーページに戻り、 Continue を押します。

次に、 Register を押します。

Key ID を書き留めてキーをダウンロードし、 src/main/resources/AuthKey_<KEYID>.p8 の Quarkus アプリケーションに保存します。

これで、 application.properties を設定できます。

Facebook では、他のほとんどの OIDC プロバイダーのように localhost でアプリケーションをテストすることはできません。 https で実行して公開する必要があるため、開発目的では https://ngrok.com などのサービスを使用することをお勧めします。

Facebook 用の OIDC を設定するには、 Creating an application から開始し、アプリのタイプとして None を選択して Next を押します。

次に、アプリケーション名と連絡先のメールアドレスを入力し、 Create app を押します。

アプリページで、 Facebook login 製品の Set up をクリックします。

Quickstarts ページをクイックし、左側のメニューの Facebook login > Settings をクリックします。

Redirect URIs を入力 (<host>/_renarde/security/oidc-success に設定) し、 Save changes を押します:

次に、左側のメニューの Settings > Basic に移動し、 App ID と App secret を書き留めます。

これで、 application.properties を設定できます。

OIDC ログインには Twitter を使用できますが、現時点では、ユーザーのメールへのアクセスが制限されているため、ご自身で Twitter を取得して確認する必要があります。

Twitter 用の OIDC を設定するには、 Creating a project で開始し、プロジェクト名を入力して、 Next を押します。

ユースケースを入力し、 Next を押します。

プロジェクトの説明を入力し、 Next を押します。

次に、アプリケーション名を入力して、 Next を押します。

キーは再び表示されないので書き留めて、 App Settings を押します。

User authentication settings セクションに移動し、 Set up を押します。

OAuth 2.0 チェックボックスをオンにします。

アプリケーションタイプとして Web App を選択し、アプリケーションの詳細を入力します (Callback URI の場合は <host>/_renarde/security/twitter-success を使用)。

次に、 Save を押します。

これで、 Client ID および Client Secret をコピーして Done を押すことができます。

これで、 application.properties を設定できます。

Spotify application を作成します。

開発目的のテスト用に、リダイレクト URI として http://localhost:8080 を追加することを忘れないでください。Spotify アプリケーションのセットアップが完了すると、クライアント ID とシークレットが生成されます。以下に例を示します。

これで、 application.properties を設定できます。