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

Resumen

Capgo Social Login reemplaza a Ionic Auth Connect con un flujo OAuth2 nativo de cada proveedor para Google, Apple, Facebook y otros proveedores de identidad. Admite varios proveedores en un solo plugin y funciona en iOS, Android y Web.

Por qué funciona

El plugin incluye un wrapper de compatibilidad con Auth Connect llamado SocialLoginAuthConnect. Asigna los IDs de proveedor de Ionic Auth Connect que ya conoces al motor OAuth2 integrado, para que puedas seguir usando nombres como auth0, azure, y okta.

Instalar

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

Reemplaza tus imports

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

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

Inicializa los proveedores

Usa la authConnect presets cuando quieras los mismos IDs de proveedor que usaba Ionic Auth Connect:

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 proveedores compatibles

• auth0
• azure
• cognito
• okta
• onelogin

Login, logout y acceso a tokens

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 por proveedor

Ejemplo de preset 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 preset 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 preset 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 preset 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 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);

Sobrescribir endpoints

Cada preset crea una configuración OAuth2 predeterminada a partir de domain o issuer. Si tu tenant usa endpoints personalizados, sobrescríbelos 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 directa de OAuth2

Si no quieres usar presets, configura los mismos proveedores directamente en la documentación genérica de OAuth2:

• Guía de proveedores OAuth2 y OIDC

Notas de migración

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

2. Los refresh tokens siguen dependiendo de los scopes Solicitud offline_access o el equivalente específico del proveedor cuando necesites refresh tokens.

3. Custom endpoints can override presets Si el preset es cercano pero no exacto, sobrescribe solo los endpoints que difieren.

4. Directo oauth2 las entradas ganan Si defines ambos authConnect.auth0 y oauth2.auth0, la configuración oauth2 directa tiene prioridad.

Documentación relacionada

• Primeros pasos con Social Login
• Proveedores OAuth2 y OIDC
• Migrar de Ionic Auth Connect
• Solución de migración de plugins de Ionic Enterprise

Continúa desde Ionic Auth Connect Migration hacia @capgo/capacitor-social-login

Si estás usando Migración de Ionic Auth Connect a @capgo/capacitor-social-login para planificar los flujos de autenticación y de cuenta, conéctalo con Uso de @capgo/capacitor-social-login para la capacidad nativa en el uso de @capgo/capacitor-social-login, @capgo/capacitor-social-login para los detalles de implementación en @capgo/capacitor-social-login, @capgo/capacitor-passkey para el detalle de implementación en @capgo/capacitor-passkey, @capgo/capacitor-native-biometric para el detalle de implementación en @capgo/capacitor-native-biometric, y Autenticación de dos factores para el detalle de implementación en la autenticación de dos factores.