Keycloak

このプラグインのインストール手順とフルマークダウンガイドのセットアップの質問をコピーする

概要

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

Keycloakクライアント設定

Keycloakのドメインで、使用するCapacitorアプリのクライアントを作成または開きます:

認可codeフローを使用します。
アプリの設定でPKCEを有効にします。
アプリが使用するすべてのリダイレクトURIを登録する必要があります。例えば、 myapp://oauth/keycloak モバイル用と、生産用Web用のHTTPSコールバックURL
Use scopes such as __CAPGO_KEEP_0__. openid profile email. __CAPGO_KEEP_1__ when your realm and client are configured to issue refresh tokens. offline_access The exact issuer URL is deployment-specific. Current Keycloak deployments commonly publish realm metadata at __CAPGO_KEEP_2__, but some deployments include an extra base path. Use the issuer URL shown by your realm’s OpenID Endpoint Configuration.

OIDC discovery example https://keycloak.example.com/realms/my-realm/.well-known/openid-configurationSection titled “OIDC discovery example”

Prefer __CAPGO_KEEP_3__ so the plugin can discover the authorization, token, and logout endpoints from the realm metadata:

For refresh tokens, request __CAPGO_KEEP_4__ only if your Keycloak realm and client allow refresh tokens for this app: issuerUrl __CAPGO_KEEP_5__

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);

__CAPGO_KEEP_7__ offline_access __CAPGO_KEEP_8__

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 discovery がブロックされている場合、またはアプリにメタデータを公開していない場合は、エンドポイントを直接設定してください。ベース 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 の互換性

Keycloak は Auth Connect のプリセットプロバイダー ID の 1 つではありません。すでに SocialLoginAuthConnectを使用している場合は、 oauth2 のジェネリック provider: 'oauth2' プロバイダーを初期化して、 providerId: 'keycloak'.

でログインできます。plus Keycloak OpenID Connect endpoint reference for discovery and endpoint paths.

Keycloak から続けて

Capgo を使用している場合 Keycloak 認証とアカウントフローの計画に使用している場合 @capgo/capacitor-social-login for the native capability in @capgo/capacitor-social-login @capgo/capacitor-social-login for the implementation detail in @capgo/capacitor-social-login @capgo/capacitor-passkey for the implementation detail in @capgo/capacitor-passkey @capgo/capacitor-native-biometric for the implementation detail in @capgo/capacitor-native-biometric, and Two-factor authentication for the implementation detail in Two-factor authentication.