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

Übersicht

Capgo Soziale Anmeldung ersetzt Ionic Auth Connect mit einem Provider- nativen 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.

Warum das funktioniert

Der Plugin enthält einen Auth Connect-Kompatibilitätswrapper namens SocialLoginAuthConnect. Es mappiert bekannte Ionic Auth Connect-Anbieter-IDs auf den eingebauten OAuth2-Motor, sodass Sie weiterhin Namen wie auth0, azure, and okta.

, und

bun add @capgo/capacitor-social-login
bunx cap sync

In die Zwischenablage kopieren

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

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

In die Zwischenablage kopieren

Benutzen Sie die authConnect Preset, wenn Sie die gleichen Provider-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 Provider-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 Presets

Beispiel für Auth0-Preset

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

Azure-Voreinstellung-Beispiel

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

Cognito-Voreinstellung-Beispiel

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

Okta-Voreinstellung-Beispiel

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

OneLogin-Voreinstellung-Beispiel

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 Profil erstellt eine Standardkonfiguration für OAuth2 von domain oder issuer. Wenn Ihr Mandant benutzerdefinierte 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 Profile verwenden möchten, konfigurieren Sie die gleichen Anbieter direkt in den allgemeinen OAuth2-Dokumenten:

• Leitfaden für den OAuth2- und OIDC-Anbieter

Migrationshinweise

1. Die Kompatibilitätslayer basiert auf OAuth2 Es behält die Namen der Anbieter bei, nicht die ursprünglichen Implementierungsdetails von Ionic.

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

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

4. Direkt oauth2 Einträge gewinnen Wenn Sie sowohl authConnect.auth0 und definieren oauth2.auth0Social Login starten oauth2 Die Konfiguration hat Vorrang.

Zugehörige Dokumentation

• Social Login starten
• OAuth2- und OIDC-Anbieter
• Migration von Ionic Auth Connect
• Migrationlösung für Ionic-Unternehmensplugins

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

Wenn Sie Ionic Auth Connect verwenden Migration von Ionic Auth Connect zu @capgo/capacitor-social-login um die Authentifizierung und die Kontenflüsse zu planen, verbinden Sie es mit Mit @capgo/capacitor-social-login für die native Fähigkeit in Mit @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-biometric für die Implementierungsdetails in @capgo/capacitor-native-biometric und Zwei-Faktor-Authentifizierung für die Implementierungsdetails in Zwei-Faktor-Authentifizierung.