Keycloak

このプラグインのインストール手順とマークダウンガイドの全てを含む設定プロンプトをコピーする。

概要

Keycloakは、組み込みの汎用OAuth2プロバイダーを通じて機能します。Keycloak用に新しいネイティブプロバイダーは必要ありません。KeycloakクライアントをOpenID Connectクライアントとして設定し、 provider: 'oauth2' with a stable providerId例えば keycloak.

Keycloakクライアント設定

認可Capacitorフローを使用します。

Use the authorization code flow.
Overview
アプリで使用するすべてのリダイレクト URI を登録してください。例えば myapp://oauth/keycloak モバイル向けに HTTPS のコールバック URL を、生産用の Web アプリ向けに HTTPS のコールバック URL を
スコープとして使用します。例えば openid profile email. Add offline_access 正確な発行者 URL は、デプロイメント依存です。現在の Keycloak のデプロイメントでは、

がよく使用されていますが、一部のデプロイメントでは追加のベースパスが含まれます。発行者 URL は、リレームの OpenID エンドポイントの構成から表示されるようにしてください。 https://keycloak.example.com/realms/my-realm/.well-known/openid-configurationOIDC の検出例

OIDC の検出例

Prefer issuerUrl コピー

import { SocialLogin } from '@capgo/capacitor-social-login';

const keycloakIssuer = 'https://keycloak.example.com/realms/my-realm';

await SocialLogin.initialize({
  oauth2: {
    keycloak: {
      appId: 'your-keycloak-client-id',
      issuerUrl: keycloakIssuer,
      redirectUrl: 'myapp://oauth/keycloak',
      scope: 'openid profile email',
      pkceEnabled: true,
      resourceUrl: `${keycloakIssuer}/protocol/openid-connect/userinfo`,
    },
  },
});

const result = await SocialLogin.login({
  provider: 'oauth2',
  options: {
    providerId: 'keycloak',
  },
});

console.log(result.result.idToken);
console.log(result.result.accessToken?.token);
console.log(result.result.resourceData);

リフレッシュトークン用に要求 offline_access このアプリのためにリフレッシュトークンを許可するKeycloakのドメインとクライアントがあれば

await SocialLogin.initialize({
  oauth2: {
    keycloak: {
      appId: 'your-keycloak-client-id',
      issuerUrl: keycloakIssuer,
      redirectUrl: 'myapp://oauth/keycloak',
      scope: 'openid profile email offline_access',
      pkceEnabled: true,
    },
  },
});

マニュアルエンドポイントフォールバック

OIDCディスカバリーがブロックされているか、またはアプリにメタデータを公開していない場合、エンドポイントを直接設定します。Base URLはKeycloakのデプロイメントが公開しているものと同じに保ちます。

const keycloakRealmUrl = 'https://keycloak.example.com/realms/my-realm';

await SocialLogin.initialize({
  oauth2: {
    keycloak: {
      appId: 'your-keycloak-client-id',
      authorizationBaseUrl: `${keycloakRealmUrl}/protocol/openid-connect/auth`,
      accessTokenEndpoint: `${keycloakRealmUrl}/protocol/openid-connect/token`,
      redirectUrl: 'myapp://oauth/keycloak',
      scope: 'openid profile email',
      pkceEnabled: true,
      resourceUrl: `${keycloakRealmUrl}/protocol/openid-connect/userinfo`,
      logoutUrl: `${keycloakRealmUrl}/protocol/openid-connect/logout`,
    },
  },
});

Auth Connect互換性

を使用している場合は、 SocialLoginAuthConnectを初期化してログインできます。 oauth2 を初期化してログインできます。 provider: 'oauth2' plus providerId: 'keycloak'.

See the Keycloak OpenID Connectエンドポイントの参照 for discovery and endpoint paths.

Keycloakから続けて

Keycloakを使用している場合 Keycloak を使用して認証とアカウントフローの計画を行い、 Capgoでは、@capgo/capacitor-social-loginを使用します。 Using @capgo/capacitor-social-login @capgo/capacitor-ソーシャルログイン for the implementation detail in @capgo/capacitor-social-login @capgo/capacitor-パスキー for the implementation detail in @capgo/capacitor-passkey @capgo/capacitor-native-biometric for the implementation detail in @capgo/capacitor-native-biometric, and 2要素認証 2要素認証の実装詳細のため。