Ionic Auth Connect Migration zu @capgo/capacitor-social-login

Übersicht

Capgo Social Login ersetzt Ionic Auth Connect durch einen provider-übergreifenden OAuth2-Flow für Google, Apple, Facebook und andere Identitätsanbieter. Es unterstützt mehrere Anbieter in einem Plugin und funktioniert auf iOS, Android und Web.

Wieso das funktioniert

Das Plugin enthält einen Auth Connect-Kompatibilitätswrapper mit dem Namen SocialLoginAuthConnectEs mappiert bekannte Ionic Auth Connect-Anbieter-IDs auf den eingebauten OAuth2-Motor, so dass Sie weiterhin Namen wie auth0, azureund okta.

Installieren

npm install @capgo/capacitor-social-login
npx cap sync

Ersetzen Sie Ihre Imports

// Before
import { AuthConnect } from '@ionic-enterprise/auth-connect';

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

Initialisieren Sie die Anbieter

Verwenden Sie die authConnect Vorlagen, wenn Sie die gleichen Anbieter-IDs verwenden möchten, die Ionic Auth Connect verwendet hat:

await SocialLoginAuthConnect.initialize({
  authConnect: {
    auth0: {
      domain: 'https://your-tenant.auth0.com',
      clientId: 'your-auth0-client-id',
      redirectUrl: 'myapp://oauth/auth0',
      audience: 'https://your-api.example.com',
    },
    azure: {
      tenantId: 'common',
      clientId: 'your-azure-client-id',
      redirectUrl: 'myapp://oauth/azure',
    },
    cognito: {
      domain: 'https://your-domain.auth.region.amazoncognito.com',
      clientId: 'your-cognito-client-id',
      redirectUrl: 'myapp://oauth/cognito',
    },
    okta: {
      issuer: 'https://dev-12345.okta.com/oauth2/default',
      clientId: 'your-okta-client-id',
      redirectUrl: 'myapp://oauth/okta',
    },
    onelogin: {
      issuer: 'https://your-tenant.onelogin.com/oidc/2',
      clientId: 'your-onelogin-client-id',
      redirectUrl: 'myapp://oauth/onelogin',
    },
  },
});

Unterstützte Anbieter-IDs

• auth0
• azure
• cognito
• okta
• onelogin

Anmeldung, Abmeldung und Token-Zugriff

const result = await SocialLoginAuthConnect.login({
  provider: 'auth0',
});

const status = await SocialLoginAuthConnect.isLoggedIn({
  provider: 'auth0',
});

const code = await SocialLoginAuthConnect.getAuthorizationCode({
  provider: 'auth0',
});

await SocialLoginAuthConnect.logout({
  provider: 'auth0',
});

Beispiel für Provider-spezifische Voreinstellungen

Beispiel für Auth0-Voreinstellungen

await SocialLoginAuthConnect.initialize({
  authConnect: {
    auth0: {
      domain: 'https://your-tenant.auth0.com',
      clientId: 'your-auth0-client-id',
      redirectUrl: 'myapp://oauth/auth0',
      audience: 'https://your-api.example.com',
    },
  },
});

const auth0Result = await SocialLoginAuthConnect.login({
  provider: 'auth0',
});

console.log(auth0Result.result.idToken);

Beispiel für Azure-Voreinstellungen

await SocialLoginAuthConnect.initialize({
  authConnect: {
    azure: {
      tenantId: 'common',
      clientId: 'your-azure-client-id',
      redirectUrl: 'myapp://oauth/azure',
    },
  },
});

const azureResult = await SocialLoginAuthConnect.login({
  provider: 'azure',
});

console.log(azureResult.result.resourceData);

Beispiel für Cognito-Voreinstellungen

await SocialLoginAuthConnect.initialize({
  authConnect: {
    cognito: {
      domain: 'https://your-domain.auth.region.amazoncognito.com',
      clientId: 'your-cognito-client-id',
      redirectUrl: 'myapp://oauth/cognito',
    },
  },
});

const cognitoResult = await SocialLoginAuthConnect.login({
  provider: 'cognito',
});

console.log(cognitoResult.result.idToken);

Beispiel für die Okta-Voreinstellung

await SocialLoginAuthConnect.initialize({
  authConnect: {
    okta: {
      issuer: 'https://dev-12345.okta.com/oauth2/default',
      clientId: 'your-okta-client-id',
      redirectUrl: 'myapp://oauth/okta',
    },
  },
});

const oktaResult = await SocialLoginAuthConnect.login({
  provider: 'okta',
});

console.log(oktaResult.result.resourceData);

Beispiel für die OneLogin-Voreinstellung

await SocialLoginAuthConnect.initialize({
  authConnect: {
    onelogin: {
      issuer: 'https://your-tenant.onelogin.com/oidc/2',
      clientId: 'your-onelogin-client-id',
      redirectUrl: 'myapp://oauth/onelogin',
    },
  },
});

const oneloginResult = await SocialLoginAuthConnect.login({
  provider: 'onelogin',
});

console.log(oneloginResult.result.idToken);

Übergeordnete Endpunkte

Jedes Voreinstellungsprofil erstellt eine Standardkonfiguration für OAuth2 von domain oder issuerWenn Ihr Mandanten spezifische Endpunkte verwendet, überschreiben Sie sie direkt:

await SocialLoginAuthConnect.initialize({
  authConnect: {
    onelogin: {
      issuer: 'https://your-tenant.onelogin.com/oidc/2',
      clientId: 'your-onelogin-client-id',
      redirectUrl: 'myapp://oauth/onelogin',
      authorizationBaseUrl: 'https://your-tenant.onelogin.com/oidc/2/auth',
      accessTokenEndpoint: 'https://your-tenant.onelogin.com/oidc/2/token',
      resourceUrl: 'https://your-tenant.onelogin.com/oidc/2/me',
      logoutUrl: 'https://your-tenant.onelogin.com/oidc/2/logout',
    },
  },
});

Direkte OAuth2-Konfiguration

Wenn Sie keine Voreinstellungen verwenden möchten, konfigurieren Sie die gleichen Anbieter direkt in den allgemeinen OAuth2-Dokumenten:

• OAuth2- und OIDC-Anbieter-Leitfaden

Migrationshinweise

1. Die Kompatibilitätslayer basiert auf OAuth2 Es behält die Anbieternamen bei, nicht die Implementierungsdetails von Ionics eigener Implementierung.

2. Aktualisierungstoken hängen weiterhin von den Berechtigungen ab Anfrage offline_access oder dem provider-spezifischen Äquivalent, wenn Sie Aktualisierungstoken benötigen.

3. Benutzerdefinierte Endpunkte können Voreinstellungen überschreiben Wenn die Voreinstellung nahe, aber nicht genau ist, überschreibe nur die Endpunkte, die sich unterscheiden.

4. Direkt oauth2 Einträge gewinnen Wenn Sie sowohl authConnect.auth0 und oauth2.auth0der direkte oauth2 Konfiguration hat Vorrang.

Verwandte Dokumentation

• Soziale Anmeldung - Einführung
• OAuth2- und OIDC-Anbieter
• Migrieren Sie von Ionic Auth Connect
• Einzige Lösung für die Migration von Ionic enterprise plugins

Fortsetzen Sie die Migration von Ionic Auth Connect zu @capgo/capacitor-social-login

Wenn Sie Ionic Auth Connect verwenden Migrieren Sie von Ionic Auth Connect zu @capgo/capacitor-social-login Um die Authentifizierung und die Kontenflüsse zu planen und zu verbinden, verwenden Sie Verwenden Sie @capgo/capacitor-social-login Für die native Fähigkeit in Verwenden Sie @capgo/capacitor-social-login, @capgo/capacitor-social-login Für die Implementierungsdetails in @capgo/capacitor-social-login, @capgo/capacitor-passkey für die Implementierungsdetails in @capgo/capacitor-Passkey, @capgo/capacitor-native-biometrisch für die Implementierungsdetails in @capgo/capacitor-native-biometrisch, und Zweifaktor-Authentifizierung für die Implementierungsdetails in Zweifaktor-Authentifizierung.