Migrazione del login Facebook a @capgo/social-login
Copia un prompt di configurazione con i passaggi di installazione e la guida markdown completa per questo plugin.
Panoramica
Sezione intitolata “Panoramica”Questa guida fornisce istruzioni dettagliate per la migrazione da @capacitor-community/facebook-login __CAPGO_KEEP_0__ @capgo/capacitor-social-login. The new plugin modernizes Facebook authentication with a unified API that supports multiple social providers, improved TypeScript support, and enhanced capabilities.
Sezione intitolata “Installazione”
Elimina il vecchio pacchetto:-
Rimuovi il vecchio pacchetto:
Finestra del terminale npm uninstall @capacitor-community/facebook-login -
Installa il nuovo pacchetto:
Finestra del terminale npm install @capgo/capacitor-social-loginnpx cap sync
Code Modifiche
Sezione intitolata “Code Modifiche”Importa Modifiche
Sezione intitolata “Importa Modifiche”import { FacebookLogin } from '@capacitor-community/facebook-login';import { SocialLogin } from '@capgo/capacitor-social-login';Inizializzazione
Sezione intitolata “Inizializzazione”Cambia Chiave: Il nuovo pacchetto richiede una configurazione esplicita nel tuo code:
// Old package required no explicit initialization in code// Configuration was done only in native platforms
// New package requires explicit initializationawait SocialLogin.initialize({ facebook: { appId: 'YOUR_FACEBOOK_APP_ID', // Required for web and Android clientToken: 'YOUR_CLIENT_TOKEN' // Required for Android }});Il metodo di accesso accetta ora un parametro provider:
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' }});Cambiamenti nel tipo di risposta
Sezione intitolata “Cambiamenti nel tipo di risposta”La struttura della risposta è stata modernizzata con un oggetto di profilo più completo:
// Old response typeinterface FacebookLoginResponse { accessToken: { applicationId: string; userId: string; token: string; expires: string; }; recentlyGrantedPermissions: string[]; recentlyDeniedPermissions: string[];}
// New response typeinterface 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; }; };}Differenze chiave:
- Ora la risposta include un campo che identifica il provider di autenticazione
providercampo che identifica il provider di autenticazione - oggetto con informazioni utente più dettagliate
profilestruttura coerente per tutti i provider di login sociale - Verifica stato di accesso
Sezione intitolata “Verifica stato di accesso”
Copia negli appunticonst result = await FacebookLogin.getCurrentAccessToken();const isLoggedIn = result && result.accessToken;
const status = await SocialLogin.isLoggedIn({ provider: 'facebook'});const isLoggedIn = status.isLoggedIn;Sezione intitolata “Disconnetti”
Copia negli appuntiawait FacebookLogin.logout();
await SocialLogin.logout({ provider: 'facebook'});Modifiche specifiche per piattaforma
Sezione intitolata “Modifiche specifiche per piattaforma”Configurazione Android
Sezione intitolata “Configurazione Android”La configurazione è ora gestita attraverso il metodo di inizializzazione:
// 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 }});Importante: Il token del client è ora richiesto per l'autenticazione Android.
Configurazione iOS
Sezione intitolata “Configurazione iOS”- La configurazione iOS in
AppDelegate.swiftrimane la stessa:
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])- La configurazione rimane la stessa:
Info.plistCopia negli appunti
<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>Sezione intitolata “Modifiche significative”
Riepilogo delle modifiche significative al momento della migrazione:L'inizializzazione esplicita è ora richiesta
- - Deve chiamare Prima dell'uso
initialize()La struttura dell'oggetto di risposta è cambiata significativamente - - Nuovo formato di risultato nidificato con dati di profilo migliorati Il token del client è ora richiesto per Android
- __CAPGO_KEEP_0__ - Ulteriore configurazione necessaria
- Metodi e strutture di parametro diversi - Approccio basato sui provider
- L'elaborazione degli errori e i tipi di errore sono cambiati - Informazioni di errore più dettagliate
Vantaggi chiave
Sezione intitolata “Vantaggi chiave”Il nuovo plugin fornisce:
- Unificato API su più provider social (Google, Apple, Facebook)
- Migliorata supporto per TypeScript con definizioni di tipo migliori
- Dati di profilo migliorati con più informazioni sull'utente
- Mantenimento attivo e supporto della community
- Gestione degli errori coerente su tutti i provider
- Gestione dei token migliore con gestione corretta delle scadenze
Per ulteriori istruzioni di configurazione dettagliate, si prega di consultare il documento ufficiale.