Pengenalan Integrasi Supabase

Judul bagian “Ringkasan”

Pengaturan Supabase Authentication dengan plugin Login Sosial Capacitor memungkinkan Anda menggunakan penyedia login sosial asli (Google, Apple, Facebook, Twitter) pada platform mobile sambil memanfaatkan Supabase Auth untuk autentikasi backend dan PostgreSQL untuk penyimpanan data.

Apa yang Anda Pelajari

• Bagaimana Mengatur Autentikasi Supabase
• Bagaimana Mengintegrasikan Capacitor Plugin Login Sosial dengan Autentikasi Supabase
• Pengaturan Platform yang Spesifik untuk Android, iOS, dan Web
• Bagaimana Menghandle Nonce dengan Aman untuk Supabase

Apa yang Anda Butuhkan

Sebelum Anda Mulai, Pastikan Anda Memiliki:

1. Proyek Supabase

   • Buat Proyek di Dashboard Supabase
   • Aktifkan penyedia OAuth Google
   • Ambil URL proyek Supabase dan kunci anonim

2. Supabase JS SDK

   • Pasang Supabase di proyek Anda:

     npm install @supabase/supabase-js

3. Proyek Capacitor

   • Aplikasi Capacitor yang sudah ada
   • Plugin login sosial Capacitor terpasang:

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

4. Pengaturan Google yang spesifik untuk platform

   • Lengkapi pengaturan Sign-In Google untuk platform-target Anda:
     • Pengaturan Login Google Android
     • Pengaturan Login Google iOS
     • Pengaturan Login Google Web

Aplikasi Contoh

Contoh aplikasi yang berfungsi sepenuhnya tersedia di repository:

Code Repository: Anda dapat menemukan repository code di sini

Aplikasi contoh menunjukkan:

• Autentikasi email/password dengan Supabase
• Integrasi Sign-In Google (Android, iOS, dan Web)
• Penyimpanan nilai kunci sederhana menggunakan tabel PostgreSQL Supabase
• Penyimpanan data pengguna dengan Keamanan Tingkat Baris (RLS)

Rincian Implementasi Kunci

Pengelolaan Nonce

Supabase memerlukan pengelolaan nonce khusus untuk keamanan. Implementasinya mengikuti dokumentasi Google Sign In React Native:

• Buat sebuah rawNonce String acak yang aman untuk URL
• Hashinya dengan SHA-256 untuk mendapatkan nonceDigest
• Kirim nonceDigest ke Google Sign-In
• Pass rawNonce ke Supabase (Supabase menghashinya secara internal untuk perbandingan)

Validasi JWT

Contoh implementasi termasuk validasi JWT untuk memastikan:

• Audien token sesuai dengan ID Klien Google yang dikonfigurasi
• Nonce sesuai dengan digest yang diharapkan
• Ulangi secara otomatis pada gagal validasi (terutama penting untuk iOS)

Konsiderasi Platform-Spesifik

• iOSPenggunaan cache token dapat menyebabkan masalah nonce - implementasi ini menangani hal ini secara otomatis
• WebPilih untuk memanggil isLoggedIn() pada saat mount untuk menghandle redirect OAuth
• AndroidImplementasi standar dengan konfigurasi fingerprint SHA-1

Langkah-Langkah Selanjutnya

Teruskan dengan panduan pengaturan:

• Penggunaan Login Supabase Google - Pengaturan Umum - Ringkasan dan persyaratan
• Pengaturan Android - Pengaturan spesifik Android
• Pengaturan iOS - Pengaturan spesifik iOS
• Pengaturan Web - Pengaturan spesifik Web

Pengaturan Sign-In Apple

• Supabase Pengaturan Sign-In Apple - Pengaturan Umum - Ringkasan dan syarat-syarat
• Pengaturan iOS - Pengaturan spesifik iOS
• Pengaturan Android - Konfigurasi spesifik Android

Teruskan dari Pengenalan Integrasi Supabase

Jika Anda menggunakan Pengenalan Integrasi Supabase untuk merencanakan autentikasi dan alur akun, hubungkannya dengan Menggunakan @capgo/capacitor-login-sosial untuk kemampuan asli dalam Menggunakan @capgo/capacitor-login-sosial, @capgo/capacitor-login-sosial untuk detail implementasi dalam @capgo/capacitor-login-sosial, @capgo/capacitor-passkey untuk detail implementasi dalam @capgo/capacitor-passkey @capgo/capacitor-biometrik native untuk detail implementasi di @capgo/capacitor-biometrik native, dan Autentikasi dua faktor untuk detail implementasi di Autentikasi dua faktor.