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

Siap untuk dipasang, termasuk instalasi, sinkronkan, dan panduan markdown sumber.

Panduan ini menjelaskan transisi dari versi lama ke versi modern dari @capacitor-community/apple-sign-in plugin ke paket @capgo/capacitor-social-login Paket baru menyediakan antarmuka yang terintegrasi untuk beberapa penyedia autentikasi sosial dengan dukungan TypeScript yang diperbarui dan perawatan aktif.

Pemasangan

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

Perubahan Kunci: 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 beberapa parameter menjadi API: yang lebih bersih

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 provider: 'apple' dan ruang lingkup opsional daripada melewati nilai konfigurasi individu seperti clientId dan redirectURI.

Perubahan Tipe Respons

Hasil sekarang termasuk accessToken objek dengan detail kedaluwarsa dan struktur yang terorganisir profile Menggantikan format respons yang lebih datar dari paket asli:

// 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;
    };
  };
}

Kemampuan Baru

Plugin yang diperbarui ini memperkenalkan fungsi yang tidak tersedia di pendahulunya:

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

Methode-methode ini menyediakan isLoggedIn() untuk memverifikasi status autentikasi dan logout() fungsi.

Perubahan Spesifik Platform

Pengaturan iOS

IOS menjaga prosedur pengaturan yang familiar melalui kemampuan Xcode:

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

Pengaturan Android

Android sekarang mendapatkan dukungan asli melalui autentikasi OAuth berbasis web: Plugin baru menyediakan dukungan Android secara langsung, tetapi memerlukan pengaturan tambahan:

Buat ID Layanan di Portal Pengembang Apple

1. Konfigurasi endpoint autentikasi web
2. Konfigurasi aplikasi Android untuk menghandle alur OAuth
3. Pengaturan layanan backend diperlukan
4. Untuk instruksi setup Android yang lebih rinci, silakan lihat:

Petunjuk Setup Android Kelebihan Utama.

Bab berjudul “Kelebihan Utama”

Android

1. API yang Terintegrasi across beberapa penyedia jejaring sosial (Google, Facebook, Apple)
2. Pengembangan Tipe TypeScript yang Ditingkatkan dengan definisi tipe yang lebih baik
3. Pemeliharaan Komunitas Aktif dibandingkan dengan versi yang sudah tidak digunakan lagi
4. Dukungan Android yang Terintegrasi melalui autentikasi berbasis web
5. Pengelolaan Status Login yang Tidak Pergi
6. Pengelolaan Kesalahan yang Lebih Baik dengan jenis kesalahan yang konsisten

Perubahan yang Mengganggu

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

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

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

Jika Anda menggunakan Migrasi Sign-In Apple ke @capgo/social-login untuk merencanakan autentikasi dan alur akun, hubungkannya dengan Menggunakan @capgo/capacitor-social-login untuk kemampuan asli dalam Menggunakan @capgo/capacitor-social-login, @capgo/capacitor-social-login untuk detail implementasi dalam @capgo/capacitor-social-login, @capgo/capacitor-passkey untuk detail implementasi dalam @capgo/capacitor-passkey @capgo/capacitor-native-biometric untuk detail implementasi di @capgo/capacitor-native-biometric, dan Autentikasi Dua Faktor untuk detail implementasi di Autentikasi Dua Faktor.