Lebih cepat ke konten

Supabase Google Login pada iOS

GitHub

Petunjuk ini akan membantu Anda mengintegrasikan Sign-In Google dengan Supabase Authentication pada iOS. Diperkirakan Anda telah menyelesaikan:

Implementasi lengkap tersedia dalam contoh aplikasi’s supabaseAuthUtils.ts file. Petunjuk ini menjelaskan konsep utama dan cara menggunakan itu.

Yaitu authenticateWithGoogleSupabase fungsi ini mengelola alur autentikasi secara keseluruhan:

import { authenticateWithGoogleSupabase } from './supabaseAuthUtils';
const result = await authenticateWithGoogleSupabase();
if (result.success) {
console.log('Signed in:', result.user);
// Navigate to your authenticated area
} else {
console.error('Error:', result.error);
}

Bagian berjudul “Bagaimana Cara Kerjanya” Untuk penjelasan rinci tentang bagaimana alur autentikasi bekerja, termasuk penggunaan nonce, validasi JWT, dan masuk ke Supabase, lihat bagian.

Bagaimana Cara Kerjanya

di panduan Pengaturan Umum

Masalah Penyimpanan Nonce iOS

Pada iOS, Google Sign-In dapat menyimpan token, yang mungkin menyebabkan validasi nonce gagal. Fungsi validateJWTToken detection otomatis

  1. Automatic Detection: Fungsi memeriksa apakah nonce di token cocok dengan nonce yang diharapkan nonceDigest
  2. Automatic Retry: Jika validasi gagal, maka fungsi keluar dari Google dan mencoba sekali lagi
  3. Error Handling: Jika usaha ulang juga gagal, maka error akan dikembalikan

Mengapa hal ini terjadi: Google Sign-In iOS SDK menyimpan token untuk meningkatkan kinerja. Ketika token yang disimpan dikembalikan, mungkin sudah dibuat dengan nonce yang berbeda (atau tidak ada nonce), sehingga menyebabkan kesalahan

Solusi: Implementasi ini secara otomatis mengelola hal ini dengan keluar dan mencoba ulang, yang memaksa Google untuk menghasilkan token segar dengan nonce yang benar.

Kerja Sampingan Manual (jika ulang coba otomatis tidak berhasil):

// Logout first to clear cached tokens
await SocialLogin.logout({ provider: 'google' });
// Then authenticate
const result = await authenticateWithGoogleSupabase();

Hal ini memastikan token segar diperoleh dengan nonce yang benar.

Untuk referensi code yang lengkap, lihat bagian Referensi Code Lengkap dalam Panduan Pengaturan Umum.

Implementasi nonce mengikuti pola dari Documentasi Sign In Google Native React:

  • rawNonce berpindah ke Supabase’s signInWithIdToken()
  • Supabase membuat hash dari rawNonce dan membandingkannya dengan nonceDigest yang termasuk dalam token ID dari Sign-In Google
  • nonceDigest (hash SHA-256, hex-encoding) berpindah ke nonce parameter dalam API Sign-In Google

Bagian authenticateWithGoogleSupabase fungsi ini termasuk retry parameter:

  • Panggilan Pertama (retry=falseJika validasi gagal, keluar otomatis dan mencoba sekali lagi
  • Panggilan Ulang (retry=trueJika validasi gagal lagi, langsung kembalikan kesalahan

Ini secara otomatis mengatasi masalah caching token iOS.

Jika autentikasi gagal:

  • Kesalahan Nonce: Fungsi ini secara otomatis mencoba ulang - periksa log konsol untuk detail. Jika tetap berlanjut, keluar manual terlebih dahulu
  • Audien Tidak Valid: Pastikan ID Klien Google Anda sesuai di kedua Google Cloud Console dan Supabase (kedua ID klien iOS dan Web)
  • Validasi token gagal: Pastikan Anda menggunakan mode: 'online' : Pastikan Anda menggunakan
  • konfigurasi Info.plist untuk mendapatkan idTokenKonfigurasi Info.plist
  • : Pastikan Info.plist memiliki URL schemes dan GIDClientID yang benar Periksa contoh aplikasi code untuk referensi

Teruskan dari Supabase Google Login on iOS

Judul: Teruskan dari Supabase Google Login on iOS

Jika Anda menggunakan Supabase Google Login on iOS Untuk merencanakan autentikasi dan alur akun, hubungkannya dengan Menggunakan @capgo/capacitor-social-login untuk kemampuan asli di Menggunakan @capgo/capacitor-social-login, @capgo/capacitor-social-login untuk detail implementasi di @capgo/capacitor-social-login, @capgo/capacitor-passkey untuk detail implementasi di @capgo/capacitor-passkey, @capgo/capacitor-native-biometric untuk detail implementasi di @capgo/capacitor-native-biometric, dan Dua faktor autentikasi untuk detail implementasi di Dua faktor autentikasi.