Ionic Auth Connect迁移至@capgo/capacitor-social-login

复制一个包含安装步骤和本插件的完整 Markdown 指南的设定提示。

概览

Capgo 社会登录替代了Ionic Auth Connect使用提供商原生OAuth2流程来实现Google、Apple、Facebook和其他身份提供商。它支持多个提供商在一个插件中，并且在iOS、Android和Web上都有效。

为什么会这样

该插件包含一个名为Auth Connect兼容性包装器的 SocialLoginAuthConnect它将熟悉的Ionic Auth Connect提供商ID映射到内置OAuth2引擎上，所以你可以继续使用类似 auth0, azure,和 okta.

安装

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

替换你的引入

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

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

初始化提供者

使用 authConnect 预设时，你可以获得与Ionic Auth Connect相同的提供者ID：

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

支持的提供者ID

auth0
azure
cognito
okta
onelogin

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

Provider-specific preset examples

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

Azure preset example

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 preset example

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 preset example

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 preset 示例

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

覆盖端点

每个预设都创建一个默认的OAuth2配置： domain 或 issuer. 如果您的租户使用自定义端点，直接覆盖它们：

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

直接OAuth2配置

如果您不想使用预设，直接在通用 OAuth2 文档中配置相同的提供者：

OAuth2 和 OIDC 提供者指南

迁移说明

兼容层基于 OAuth2 它保留了提供者的名称，而不是 Ionic 的原生实现细节
刷新令牌仍然依赖于范围 Request offline_access 或当您需要刷新令牌时，使用提供者特定的等效项。
自定义端点可以覆盖预设 如果预设接近但不是准确的，覆盖仅与预设不同之处的端点。
直接 oauth2 条目获胜 如果您定义了两者 authConnect.auth0 和 oauth2.auth0，直接 oauth2 配置优先级。

如果您正在使用 Ionic Auth Connect迁移至@capgo/capacitor-social-login 来规划身份验证和帐户流程，连接它与使用@capgo/capacitor-social-login 为native能力在使用@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 的实现细节双因素认证对于双因素认证的实现细节