Migrasi Sign-In Apple ke @capgo/social-login

Ringkasan

Petunjuk ini menjelaskan transisi dari plugin legacy ke plugin modern. @capacitor-community/apple-sign-in Plugin baru menyediakan antarmuka yang terintegrasi untuk penyedia autentikasi sosial yang lebih dari satu dengan dukungan TypeScript yang diperbarui dan perawatan aktif. @capgo/capacitor-social-login Instalasi

__CAPGO_KEEP_0__

1. Hapus paket lama:

   npm uninstall @capacitor-community/apple-sign-in

2. Pasang paket baru:

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

Code Perubahan

Impor Perubahan

import { SignInWithApple } from '@capacitor-community/apple-sign-in';
import { SocialLogin } from '@capgo/capacitor-social-login';

Inisialisasi

Kunci Perubahan: Plugin baru memerlukan langkah inisialisasi yang tidak perlu sebelumnya.

// No initialization needed in old package
// For iOS: Basic configuration
await SocialLogin.initialize({
  apple: {} // Basic iOS configuration
});

// For Android: Additional configuration required
await SocialLogin.initialize({
  apple: {
    clientId: 'YOUR_SERVICE_ID', // Service ID from Apple Developer Portal
    redirectUrl: 'https://your-backend.com/callback' // Your backend callback URL
  }
});

Peringatan Penting: Untuk iOS, Anda menyediakan konfigurasi dasar, sedangkan Android memerlukan detail tambahan termasuk ID Layanan dan URL panggilan balik backend untuk autentikasi OAuth berbasis web.

Masuk

Proses login disederhanakan dari parameter banyak ke struktur yang lebih bersih API:

const result = await SignInWithApple.authorize({
  clientId: 'com.your.app',
  redirectURI: 'https://your-app.com/callback',
  scopes: 'email name',
  state: '12345',
  nonce: 'nonce'
});

const result = await SocialLogin.login({
  provider: 'apple',
  options: {
    // Optional: Add scopes if needed
    scopes: ['email', 'name'],
    nonce: 'nonce'
  }
});

Plugin baru menggunakan login() dengan dan skop opsional daripada melewati nilai konfigurasi individu seperti provider: 'apple' dan clientId Perubahan Tipe Respons redirectURI.

Bagian berjudul “Perubahan Tipe Respons”

objek dengan detail kedaluwarsa dan struktur accessToken bagian, menggantikan format respons yang lebih datar dari paket asli: profile Salin ke clipboard

// Old response type
interface AppleSignInResponse {
  response: {
    user: string;
    email: string | null;
    givenName: string | null;
    familyName: string | null;
    identityToken: string | null;
    authorizationCode: string | null;
  };
}

// New response type
interface SocialLoginResponse {
  provider: 'apple';
  result: {
    accessToken: {
      token: string;
      expiresIn?: number;
      refreshToken?: string;
    } | null;
    idToken: string | null;
    profile: {
      user: string;
      email: string | null;
      givenName: string | null;
      familyName: string | null;
    };
  };
}

Bagian berjudul “Kemampuan Baru”

dengan dan skop opsional daripada melewati nilai konfigurasi individu seperti __CAPGO_KEEP_0__

Mengecek Status Login

// Not available in old package
const status = await SocialLogin.isLoggedIn({
  provider: 'apple'
});

Fungsi Logout

// Not available in old package
await SocialLogin.logout({
  provider: 'apple'
});

Metode-metode ini menyediakan isLoggedIn() untuk memverifikasi status autentikasi dan logout() fungsi.

Perubahan Spesifik Platform

Pengaturan iOS

iOS menggunakan prosedur pengaturan yang familiar melalui kemampuan Xcode:

1. Pengaturan iOS tetap besarannya sama. Anda masih perlu:
   • Mengaktifkan kemampuan “Masuk dengan Apple” di Xcode
   • Mengonfigurasi aplikasi Anda di Portal Pengembang Apple
   • Tidak ada perubahan tambahan code yang diperlukan untuk iOS

Pengaturan Android

Android saat ini menerima dukungan asli melalui autentikasi berbasis web OAuth:

Plugin baru menyediakan dukungan Android secara langsung, tetapi memerlukan pengaturan tambahan:

1. Buat ID Layanan di Portal Pengembang Apple
2. Konfigurasi endpoint autentikasi web
3. Atur aplikasi Android Anda untuk menghandle alur OAuth
4. Konfigurasi layanan backend diperlukan

Untuk instruksi setup Android yang lebih rinci, silakan lihat Petunjuk Setup Android.

Kelebihan Utama

Paket modern yang disediakan:

1. API yang Terintegrasi across beberapa penyedia jejaring sosial (Google, Facebook, Apple)
2. Tipe TypeScript yang Diperbarui dengan definisi tipe yang lebih baik
3. Pemeliharaan komunitas yang Aktif __CAPGO_KEEP_0__ dibandingkan dengan versi yang sudah tidak digunakan lagi
4. Dukungan Android yang sudah terintegrasi __CAPGO_KEEP_0__ melalui autentikasi berbasis web
5. Pengelolaan status login yang persisten
6. Pengelolaan kesalahan yang lebih baik dengan jenis kesalahan yang konsisten

Perubahan Perubahan

1. Inisialisasi eksplisit sekarang diperlukan - tidak ada konfigurasi default
2. Struktur objek respons telah berubah - format hasil yang terikat
3. Implementasi Android memerlukan layanan backend untuk OAuth untuk OAuth
4. Pengelolaan token berbeda - pengelolaan token yang diperbaiki
5. Pengelolaan kesalahan dan jenis kesalahan telah berubah - kesalahan yang lebih rinci

Untuk instruksi setup yang lebih rinci, silakan lihat dokumentasi resmi Halaman Edit.