入门

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

        Set up this Capacitor plugin in the project.

Use the package manager already used by the project.
Install these package(s): `@capgo/capacitor-social-login`
Run the required Capacitor sync/update step after installation.
Read this markdown guide for the full setup steps: https://raw.githubusercontent.com/Cap-go/website/refs/heads/main/apps/docs/src/content/docs/docs/plugins/social-login/getting-started.mdx
Use that guide for platform-specific steps, native file edits, permissions, config changes, imports, and usage setup.
If that guide references other docs pages, read them too.

安装

您可以使用我们的 AI 助手设置来安装插件。将 Capgo 技能添加到您的 AI 工具中，使用以下命令:

npx skills add https://github.com/cap-go/capacitor-skills --skill capacitor-plugins

然后使用以下提示:

Use the `capacitor-plugins` skill from `cap-go/capacitor-skills` to install the `@capgo/capacitor-social-login` plugin in my project.

如果您更喜欢手动设置，请按照以下命令安装插件并遵循以下平台特定的说明:

安装包
终端窗口
```
bun add @capgo/capacitor-social-login
```
同步本地项目
终端窗口
```
bunx cap sync
```

在应用启动时初始化

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

await SocialLogin.initialize({
  google: {
    webClientId: 'your-google-web-client-id',
    iOSClientId: 'your-google-ios-client-id',
    iOSServerClientId: 'your-google-web-client-id',
    mode: 'online',
  },
  apple: {
    clientId: 'your-apple-service-id',
    useProperTokenExchange: true,
    useBroadcastChannel: true,
  },
  facebook: {
    appId: 'your-facebook-app-id',
  },
  twitter: {
    clientId: 'your-twitter-client-id',
    redirectUrl: 'myapp://oauth/twitter',
  },
  oauth2: {
    github: {
      appId: 'your-github-client-id',
      authorizationBaseUrl: 'https://github.com/login/oauth/authorize',
      accessTokenEndpoint: 'https://github.com/login/oauth/access_token',
      redirectUrl: 'myapp://oauth/github',
      scope: 'read:user user:email',
      pkceEnabled: true,
    },
  },
});

核心流程示例

await SocialLogin.login({
  provider: 'google',
  options: { scopes: ['profile', 'email'] },
});

await SocialLogin.login({
  provider: 'oauth2',
  options: {
    providerId: 'github',
    scope: 'read:user user:email',
  },
});

会话检查

const status = await SocialLogin.isLoggedIn({ provider: 'google' });
await SocialLogin.logout({ provider: 'google' });

认证码和刷新

// For providers that support this mode
const authCodeResult = await SocialLogin.getAuthorizationCode({ provider: 'google' });
await SocialLogin.refresh({ provider: 'google', options: {} as never });

高级辅助

const jwt = await SocialLogin.decodeIdToken({
  idToken: 'eyJhbGciOi...',
});

const { date } = await SocialLogin.getAccessTokenExpirationDate({
  accessTokenExpirationDate: Date.now() + 3600 * 1000,
});

const expired = await SocialLogin.isAccessTokenExpired({
  accessTokenExpirationDate: Date.now() + 1000,
});

const active = await SocialLogin.isRefreshTokenAvailable({ refreshToken: 'a-token' });

供应商特定说明

Google 离线模式

google.mode: 'offline' 返回 serverAuthCode 从登录中返回。在此模式下，注销， isLoggedIn，获取授权码和刷新是不可用的。

使用 serverAuthCode 仅作为输入到您的后端令牌交换。如果您需要在应用程序中调用，请 SocialLogin.refresh() 使用 google.mode: 'online' 苹果

苹果

context useProperTokenExchange: true HTML文本片段来自更长的Capgo UI字符串（父项键`compare_capawesome_step2_text`）。页面/区域：Capgo营销网站。角色：长营销或法律段落。见：页面替代方案/capawesome.astro。保留Capgo产品/品牌和开发人员术语完全不变。消息键`compare_capawesome_step2_text`（Compare Capawesome Step2 Text）。 useBroadcastChannel: true 用于严格令牌处理和

用于Android简化设置。

使用 OAuth2LoginOptions.flow: 'redirect' 适用于需要从页面导航到其他页面的 Web 流程。

动态提供者依赖

您可以配置要包含的提供者以减少原生应用大小。这在您的应用只需要特定提供者时最为有用。

添加提供者配置到 capacitor.config.ts:

import type { CapacitorConfig } from '@capacitor/cli';

const config: CapacitorConfig = {
  appId: 'com.example.app',
  appName: 'MyApp',
  webDir: 'dist',
  plugins: {
    SocialLogin: {
      providers: {
        google: true,
        facebook: true,
        apple: true,
        twitter: false,
      },
      logLevel: 1,
    },
  },
};

export default config;

提供者值的含义:

true:表示提供者已启用，其原生依赖项已打包。
false:表示提供者已禁用，其原生依赖项未打包。

重要细节:

开始 bunx cap sync 更改提供者配置后
如果未提供提供者配置，则所有提供者都将默认为 true 为了向后兼容
禁用提供者 false 使其在运行时不可用，即使该提供者仅使用系统API
此配置仅影响iOS和Android;它不会影响Web
Apple Sign-In on Android uses OAuth without external SDK dependencies.
Twitter/X uses standard OAuth 2.0 without external SDK dependencies.

仅包括Google Sign-In和Apple Sign-In:

plugins: {
  SocialLogin: {
    providers: {
      google: true,
      facebook: false,
      apple: true,
      twitter: false,
    },
  },
}

Ionic 企业插件迁移解决方案

如果您正在使用开始来规划身份验证和帐户流程，连接它使用@capgo/capacitor-social-login 为@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的实现细节并且为两步验证的实现细节。

入门

安装