Skip to content
Capgo - Capacitor アプリのリアルタイム更新 Capgo

Keycloak

GitHub

概要

「概要」のセクション

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

Keycloakクライアント設定

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

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

  1. Use the authorization code flow.
  2. アプリが使用するすべてのリダイレクトURIを登録する必要があります。例えば
  3. Keycloakクライアント設定 myapp://oauth/keycloak モバイル向けとHTTPSコールバックURLの生産Web向け。
  4. スコープとして openid profile emailを追加します。 offline_access リレームとクライアントがリフレッシュトークンを発行するように設定されている場合にのみ。

正確な発行元URLは、デプロイメント依存です。現在のKeycloakデプロイメントでは、一般に https://keycloak.example.com/realms/my-realm/.well-known/openid-configurationにレールメタデータを公開していますが、一部のデプロイメントでは追加のベースパスが含まれます。発行元URLは、レールのOpenIDエンドポイント構成によって示されます。

OIDC検出の例

「OIDC検出の例」というセクション

を優先してください。そうすることで、プラグインはレールメタデータから認証、トークン、ログアウトエンドポイントを検出できるようになります。 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);

__CAPGO_KEEP_0__ 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 の検出がブロックされている場合や、またはアプリにメタデータを公開していない場合、エンドポイントを直接設定する必要があります。基底 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 の互換性

セクション “Auth Connect の互換性”

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

See the Keycloak OpenID Connect endpoint reference for discovery and endpoint paths.

Section titled “Related docs”

Keycloakから続けてください

Section titled “If you are using”

If you are using Keycloak Keycloak を認証とアカウントフローの計画に使用し、 @capgo/capacitor-social-loginを使用する @capgo/capacitor-social-loginのネイティブ機能を使用する @capgo/capacitor-social-login @capgo/capacitor-social-loginの実装詳細 @capgo/capacitor-passkey @capgo/capacitor-passkeyの実装詳細 @capgo/capacitor-native-biometric @capgo/capacitor-native-biometricの実装詳細 2要素認証 2要素認証の実装詳細