Migración de Ionic Auth Connect a @capgo/capacitor-social-login

Sección titulada “Resumen”

Capgo Inicio de sesión social reemplaza Ionic Auth Connect con un flujo de OAuth2 nativo del proveedor para Google, Apple, Facebook y otros proveedores de identidad. Soporta múltiples proveedores en un plugin y funciona en iOS, Android y Web.

¿Por qué funciona

El plugin incluye un wrapper de compatibilidad de Auth Connect con el nombre SocialLoginAuthConnect . Mapea los IDs de proveedores de Ionic Auth Connect conocidos a la motor de OAuth2 integrada, por lo que puede seguir utilizando nombres como auth0, azure, y okta.

Instalar

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

Sustituye tus importaciones

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

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

Iniciar proveedores

Utilice los authConnect preset cuando desee los mismos IDs de proveedor que Ionic Auth Connect utilizó:

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',
    },
  },
});

IDs de proveedor admitidos

• auth0
• azure
• cognito
• okta
• onelogin

Acceso de inicio de sesión, cierre de sesión y token

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',
});

Ejemplos de presets específicos de proveedor

Ejemplo de configuración de Auth0

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

Ejemplo de configuración de Azure

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

Ejemplo de configuración de Cognito

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

Ejemplo de configuración de Okta

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

Ejemplo de preset de OneLogin

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

Sobreescribiendo puntos de conexión

Cada preset crea una configuración de OAuth2 predeterminada desde domain o issuer. Si su inquilino utiliza puntos de conexión personalizados, sobreescribirlas directamente:

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',
    },
  },
});

Configuración de OAuth2 directa

If no presets desean, configúrense los mismos proveedores directamente en los documentos de OAuth2 genéricos:

• Guía del proveedor de OAuth2 y OIDC

Notas de migración

1. La capa de compatibilidad está basada en OAuth2 Mantiene los nombres de los proveedores, no los detalles de implementación nativa de Ionic.

2. Los tokens de refresco todavía dependen de los alcances Solicitud offline_access o el equivalente específico del proveedor cuando necesite tokens de refresco.

3. Puntos finales personalizados pueden sobreescribir los presets Si el preset es cercano pero no exacto, sobreescriba solo los puntos finales que difieren.

4. Directo oauth2 entradas ganan Si define tanto authConnect.auth0 y oauth2.auth0, la configuración directa oauth2 toma prioridad.

Documentación relacionada

• Iniciar sesión con inicio de sesión social
• Proveedores de OAuth2 y OIDC
• Migrar desde Ionic Auth Connect
• Solución de migración de plugins de Ionic enterprise

Siga adelante desde la migración de inicio de sesión social de Ionic Auth Connect a @capgo/capacitor-social-login

Si estás utilizando La migración de Ionic Auth Connect a @capgo/capacitor-login-social para planificar la autenticación y los flujos de cuenta, conecta con Usando @capgo/capacitor-login-social para la capacidad nativa en Usando @capgo/capacitor-login-social, @capgo/capacitor-login-social para el detalle de implementación en @capgo/capacitor-login-social, @capgo/capacitor-passkey para el detalle de implementación en @capgo/capacitor-passkey, @capgo/capacitor-biométrica-nativa para el detalle de implementación en @capgo/capacitor-biométrica-nativa, y Autenticación de dos factores para el detalle de implementación en Autenticación de dos factores.