Langsung ke konten

Supabase Google Masuk pada iOS

Panduan ini akan membantu Anda mengintegrasikan Google Masuk dengan Supabase Otentikasi di iOS. Diasumsikan bahwa Anda telah menyelesaikan:

Implementasi lengkapnya tersedia di file aplikasi contoh supabaseAuthUtils.ts. Panduan ini menjelaskan konsep-konsep utama dan cara menggunakannya.

Fungsi authenticateWithGoogleSupabase menangani seluruh alur autentikasi:

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

For a detailed explanation of how the authentication flow works, including nonce generation, JWT validation, and Supabase sign-in, see the How It Works section in the General Setup guide.

iOS Masalah Tanpa Caching

Pada iOS, Google Masuk dapat menyimpan token dalam cache, yang dapat menyebabkan validasi nonce gagal. Fungsi validateJWTToken mendeteksi hal ini dan secara otomatis menanganinya:

  1. Deteksi Otomatis: Fungsi ini memeriksa apakah nonce dalam token cocok dengan nonceDigest yang diharapkan
  2. Coba Ulang Otomatis: Jika validasi gagal, validasi akan otomatis keluar dari Google dan mencoba lagi satu kali
  3. Penanganan Kesalahan: Jika percobaan ulang juga gagal, kesalahan akan dikembalikan

Mengapa ini terjadi: iOS Google Masuk SDK menyimpan token dalam cache untuk kinerja. Ketika token yang disimpan dalam cache dikembalikan, token tersebut mungkin dibuat dengan nonce yang berbeda (atau tanpa nonce), sehingga menyebabkan ketidakcocokan.

Solusinya: Implementasinya secara otomatis menangani hal ini dengan keluar dan mencoba lagi, yang memaksa Google menghasilkan token baru dengan nonce yang benar.

Solusi Manual (jika coba ulang otomatis tidak berhasil):

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

Hal ini memastikan token baru diperoleh dengan nonce yang benar.

Untuk referensi kode lengkap, lihat bagian Referensi Kode Lengkap di panduan Pengaturan Umum.

Implementasi nonce mengikuti pola dari dokumentasi Masuk React Native Google:

  • rawNonce pergi ke signInWithIdToken() Supabase
  • Supabase membuat hash rawNonce dan membandingkannya dengan nonceDigest yang disertakan dalam token ID dari Google Masuk
  • nonceDigest (hash SHA-256, dikodekan hex) masuk ke parameter nonce di Google Sign-In API

Fungsi authenticateWithGoogleSupabase menyertakan parameter retry:

  • Panggilan pertama (retry=false): Jika validasi gagal, otomatis logout dan coba lagi satu kali
  • Coba lagi panggilan (retry=true): Jika validasi gagal lagi, kesalahan akan segera muncul

Ini menangani masalah cache token iOS secara otomatis.

Jika otentikasi gagal:- Nonce mismatch: Fungsi ini mencoba ulang secara otomatis - periksa log konsol untuk detailnya. Jika masih berlanjut, logout terlebih dahulu secara manual

  • Invalid audience: Verify your Google Client IDs match in both Google Cloud Console and Supabase (both iOS and Web client IDs)
  • Validasi token gagal: Pastikan Anda menggunakan mode: 'online' dalam panggilan inisialisasi untuk mendapatkan idToken
  • Konfigurasi Info.plist: Pastikan Info.plist memiliki skema URL dan GIDClientID yang benar
  • Tinjau contoh kode aplikasi untuk referensi