Facebook 로그인 @capgo/social-login으로 마이그레이션합니다.

복사할 수 있는 설정 지시

개요

이 가이드는 Facebook으로부터의 이전을 위한 상세한 지침을 제공합니다. @capacitor-community/facebook-login to @capgo/capacitor-social-login새 플러그인은 Facebook 인증을 현대화하고 여러 소셜 제공자 지원, 향상된 TypeScript 지원 및 향상된 기능을 제공하는 통합 API를 지원합니다.

설치 제목

기존 패키지를 제거하세요:

npm uninstall @capacitor-community/facebook-login

새로운 패키지를 설치하세요:

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

Code 변경 사항

변경 사항 가져오기

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

초기화

Key Change: 새로운 패키지는 code에서 명시적인 설정이 필요합니다.

// Old package required no explicit initialization in code
// Configuration was done only in native platforms

// New package requires explicit initialization
await SocialLogin.initialize({
  facebook: {
    appId: 'YOUR_FACEBOOK_APP_ID',        // Required for web and Android
    clientToken: 'YOUR_CLIENT_TOKEN'       // Required for Android
  }
});

로그인

const FACEBOOK_PERMISSIONS = ['email', 'public_profile'];
const result = await FacebookLogin.login({ permissions: FACEBOOK_PERMISSIONS });

const result = await SocialLogin.login({
  provider: 'facebook',
  options: {
    permissions: ['email', 'public_profile'],
    limitedLogin: false,
    nonce: 'optional_nonce'
  }
});

로그인 방법이 제공자 매개변수를 받을 수 있게 변경되었습니다.

응답 형식이 개선되었습니다.

// Old response type
interface FacebookLoginResponse {
  accessToken: {
    applicationId: string;
    userId: string;
    token: string;
    expires: string;
  };
  recentlyGrantedPermissions: string[];
  recentlyDeniedPermissions: string[];
}

// New response type
interface FacebookLoginResponse {
  provider: 'facebook';
  result: {
    accessToken: {
      token: string;
      applicationId?: string;
      expires?: string;
      userId?: string;
      permissions?: string[];
      declinedPermissions?: string[];
    } | null;
    idToken: string | null;
    profile: {
      userID: string;
      email: string | null;
      friendIDs: string[];
      birthday: string | null;
      ageRange: { min?: number; max?: number } | null;
      gender: string | null;
      location: { id: string; name: string } | null;
      hometown: { id: string; name: string } | null;
      profileURL: string | null;
      name: string | null;
      imageURL: string | null;
    };
  };
}

기본적인 차이점:

응답에는 인증 제공자의 provider 식별을 위한 field가 포함됩니다.
추가 사용자 정보를 포함하는 profile 더 자세한 객체
모든 사회 로그인 제공자에서 일관된 구조

const result = await FacebookLogin.getCurrentAccessToken();
const isLoggedIn = result && result.accessToken;

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

로그아웃

await FacebookLogin.logout();

await SocialLogin.logout({
  provider: 'facebook'
});

플랫폼별 변경 사항

안드로이드 설정

초기화 메서드를 통해 구성이 처리됩니다:

// AndroidManifest.xml changes remain the same
// strings.xml become irrelevant
// Additionally initialize in your code:
await SocialLogin.initialize({
  facebook: {
    appId: 'your-app-id',
    clientToken: 'your-client-token'  // New requirement
  }
});

중요클라이언트 토큰이 이제 안드로이드 인증에 필요합니다.

iOS 설정

iOS 설정은 여전히 동일합니다: AppDelegate.swift __CAPGO_KEEP_0__

import FBSDKCoreKit

// In application:didFinishLaunchingWithOptions:
FBSDKCoreKit.ApplicationDelegate.shared.application(
    application,
    didFinishLaunchingWithOptions: launchOptions
)

// In application:openURL:options:
ApplicationDelegate.shared.application(
    app,
    open: url,
    sourceApplication: options[UIApplication.OpenURLOptionsKey.sourceApplication] as? String,
    annotation: options[UIApplication.OpenURLOptionsKey.annotation]
)

The Info.plist 설정은 동일합니다:

<key>CFBundleURLTypes</key>
<array>
    <dict>
        <key>CFBundleURLSchemes</key>
        <array>
            <string>fb[APP_ID]</string>
        </array>
    </dict>
</array>
<key>FacebookAppID</key>
<string>[APP_ID]</string>
<key>FacebookClientToken</key>
<string>[CLIENT_TOKEN]</string>
<key>FacebookDisplayName</key>
<string>[APP_NAME]</string>
<key>LSApplicationQueriesSchemes</key>
<array>
    <string>fbapi</string>
    <string>fbauth</string>
    <string>fb-messenger-share-api</string>
    <string>fbauth2</string>
    <string>fbshareextension</string>
</array>

변경 사항

변경 사항의 요약: 마이그레이션 시

explicit 초기화가 필요합니다 - 반드시 호출해야 합니다. initialize() 사용 전에
- 향상된 프로필 데이터를 포함하는 새로운 중첩된 결과 형식 - New nested result format with enhanced profile data
Android 클라이언트 토큰이 필요합니다. - 추가 설정이 필요합니다.
메서드 이름과 매개 변수 구조가 다릅니다. - 제공자 기반 접근법
오류 처리 및 오류 유형이 변경되었습니다. - 더 자세한 오류 정보

주요 이점

새로운 플러그인은 다음과 같은 이점을 제공합니다:

통합 API 여러 소셜 제공자 (Google, Apple, Facebook)across
향상된 TypeScript 지원 더 나은 타입 정의와 함께
강화된 프로필 데이터 더 많은 사용자 정보와 함께
활발한 유지 보수 및 커뮤니티 지원
모든 제공자에서 일관된 오류 처리 모든 제공자에서 일관된 오류 처리
토큰 관리 유효 기간에 대한 적절한 처리

자세한 설정 지침을 위해 공식 문서를 참조하십시오 Keep going from Facebook Login Migration to @__CAPGO_KEEP_0__/social-login.

Facebook 로그인 마이그레이션을 사용 중이라면 Facebook 로그인 마이그레이션을 @capgo/social-login 에서 수행합니다. Using @__CAPGO_KEEP_0__/__CAPGO_KEEP_1__-social-login을 사용하여 Using @capgo/capacitor-social-login의 네이티브 기능을 위해 Using @capgo/capacitor-social-login Using @capgo/capacitor-social-login의 구현 세부 정보를 위해 Using @capgo/capacitor-passkey의 구현 세부 정보를 위해 Using @capgo/capacitor-passkey Using @capgo/capacitor-native-biometric의 구현 세부 정보를 위해 Using @capgo/capacitor-native-biometric Using @capgo/capacitor-native-biometric 두 단계 인증 두 단계 인증 구현에 대한 구체적인 정보