00:00:00Sebuah laporan yang terbit bulan ini memindai sekitar 20.000 aplikasi independen dan menemukan bahwa satu dari sembilan
00:00:04mengekspos kredensial Supabase dalam kode front-end mereka.
00:00:08Ini bukan di log server atau repositori privat.
00:00:11Ini ada di dalam JavaScript yang diunduh oleh setiap pengunjung.
00:00:14Dan masalahnya, aplikasi ini tidak diretas, mereka hanya tidak sengaja menyertakan kuncinya.
00:00:18Sebagai catatan, beberapa kunci memang dimaksudkan untuk publik.
00:00:21Masalahnya ada pada alurnya, karena kesalahan yang sama bisa mengirim kunci yang seharusnya tidak boleh
00:00:25ada di browser sejak awal.
00:00:27Kami selalu merilis video baru setiap saat.
00:00:28Pastikan untuk berlangganan.
00:00:35Inilah fakta sederhana yang sering membuat orang bingung.
00:00:38Kita semua tahu hal ini, tapi mudah terlewat saat sedang terburu-buru.
00:00:41Saat Anda menandai variabel lingkungan sebagai publik, alat build Anda akan menganggapnya sebagai bagian
00:00:46dari browser dan menambahkannya ke bundel klien.
00:00:50Next.js melakukannya dengan Next.public, Vite dengan Vite, dan SvelteKit menggunakan
00:00:56public.
00:00:57Next bukanlah label keamanan, itu sebenarnya adalah label pengiriman.
00:01:01Sekarang kita tahu itu, tapi inilah bagian terkait Supabase-nya.
00:01:04Beberapa kunci memang publik, seperti kunci anon atau publishable, dan beberapa bersifat privat, seperti
00:01:10kunci service role atau secret.
00:01:12Jika kunci privat berakhir di browser, yah, saya rasa Anda bisa menebak apa yang terjadi.
00:01:17Keamanan tingkat baris (RLS) tidak akan menolong Anda dalam kasus itu.
00:01:20Dokumentasi Supabase jelas menyatakan bahwa kunci service dapat melewati RLS.
00:01:24Jadi jika kunci itu ada di front-end Anda, semua pengaturan kebijakan Anda tidak lagi berguna.
00:01:29Sekarang biarkan saya tunjukkan bagaimana ini bisa terjadi menggunakan sandbox saya sendiri.
00:01:33Pertama, saya membuat aplikasi CRUD sederhana menggunakan Next.js dan menghubungkan Supabase ke dalamnya.
00:01:38Ini file ENV saya, dan inilah kesalahannya.
00:01:41Saya menaruh kunci di balik variabel berawalan public.
00:01:45Kunci ini bersifat publishable, jadi wajar jika terlihat.
00:01:48Masalah sebenarnya adalah jalur Next.public yang sama ini bisa secara tidak sengaja mengirim kunci privat juga.
00:01:53Saat saya menjalankan npm run build untuk membangunnya, lalu saya menjalankan aplikasi saya.
00:01:59Di sinilah saya di Chrome.
00:02:00Mari saya tambahkan sedikit info ke database aplikasi CRUD kita.
00:02:05Oke, sekarang saya bisa membuka bundel JavaScript yang sudah dikompilasi dan saya akan mencarinya.
00:02:10Itu dia.
00:02:12URL dan kuncinya benar-benar ada di dalam file yang baru saja ditarik oleh pengguna Anda
00:02:18ke browser mereka.
00:02:19Dan perhatikan apa yang tidak terjadi.
00:02:21Tidak ada yang membobol ini.
00:02:22Saya menemukannya begitu saja, kan?
00:02:24Tidak ada yang mengeksploitasi apa pun.
00:02:25Ini hanya membaca apa yang sudah dikirimkan aplikasi ke internet publik.
00:02:29Jika Anda bisa melihatnya, siapa pun bisa melihatnya.
00:02:32Buka dev tools, lihat file JavaScript, dan cari kuncinya.
00:02:35Hanya itu yang perlu dilakukan.
00:02:36Jadi jika rencana Anda adalah "tidak akan ada yang melihat", internet itu penuh dengan orang dan bot
00:02:41yang tugasnya memang mencari hal-hal seperti ini.
00:02:44Jadi, inilah solusi yang benar-benar berhasil.
00:02:47Browser seharusnya hanya memanggil API Anda.
00:02:50API Anda berjalan di sisi server.
00:02:52Di situlah kunci privat berada.
00:02:54Pindahkan operasi privat ke rute API atau fungsi server.
00:02:58Klien memanggil endpoint Anda, endpoint Anda memanggil Supabase, lalu build ulang dan periksa kembali
00:03:03di dalam bundel.
00:03:04Jika kuncinya hilang dari bundel, berarti Anda sudah memperbaikinya, tapi jangan berhenti di situ saja
00:03:09karena ada hal-hal lain yang bisa Anda lakukan.
00:03:11Pastikan Row Level Security diaktifkan untuk tabel yang menghadap ke pengguna dan pastikan kebijakan Anda
00:03:16berjalan sesuai keinginan Anda.
00:03:18Luangkan waktu untuk melakukan pengujian juga.
00:03:19Saya rasa bagian ini sering kali diabaikan.
00:03:21Sekarang bagian agar hal ini tidak terulang, kebanyakan orang memperbaikinya sekali, lalu mengulanginya
00:03:26kemudian saat sedang terburu-buru.
00:03:28Jadi tambahkan pembatas, mulailah dengan pemindaian rahasia di CI agar build gagal jika ada kunci yang muncul
00:03:34di tempat yang tidak seharusnya.
00:03:36Lalu buat aturan PR bahwa apa pun dengan next public atau Vite diperlakukan sebagai publik secara default karena
00:03:41memang begitulah adanya.
00:03:42Terakhir, tambahkan rotasi kunci.
00:03:43Jika Anda merasa ada indikasi sekecil apa pun bahwa kunci terekspos, segera rotasi.
00:03:47Itu lebih baik daripada menunggu dan melihat apa yang terjadi selama beberapa hari.
00:03:50Inilah yang bisa Anda coba sekarang.
00:03:52Build aplikasi Anda dengan cara yang sama seperti saat Anda merilisnya.
00:03:55Cari di hasil output untuk Supabase JWT service secret dan apa pun yang terlihat seperti token.
00:04:01Jika Anda menemukan sesuatu yang privat, anggap itu sudah bocor karena Anda saja bisa menemukannya.
00:04:05Rotasi kuncinya dan ubah logika Anda ke sisi server.
00:04:08Jika Anda hanya ingat satu kalimat dari video ini, ingatlah ini.
00:04:11Jika itu ada di dalam bundel, berarti itu publik.
00:04:13Sampai jumpa di video lainnya.