Kembali ke Blog
News

Tutorial n8n #10: Mengambil Data dari Form dan Menyimpannya ke Supabase

Panduan praktis membuat workflow n8n Form Trigger ke Supabase Insert untuk menyimpan submission form ke tabel lead_intake, lengkap dengan setup Cloud, opsi self-hosted, credential, mapping field, troubleshooting, dan checklist keamanan.

•
Frendi Triarista
Tutorial n8n #10: Mengambil Data dari Form dan Menyimpannya ke Supabase
newsn8nsupabaseworkflow automationtutorial n8ndatabaseform automation

Tutorial n8n #10: Mengambil Data dari Form dan Menyimpannya ke Supabase

Pada tutorial #9, kita sudah memakai n8n Form Trigger dan Data Table untuk menangkap input sederhana. Di tutorial #10 ini, kita naik satu level: data dari form akan disimpan ke database eksternal, yaitu Supabase.

Bagi saya, ini adalah langkah penting dari prototype menuju sistem yang lebih rapi. Data Table cocok untuk percobaan cepat, tetapi ketika data mulai dipakai oleh aplikasi, dashboard, tim sales, atau proses analitik, database eksternal seperti Supabase memberi struktur yang lebih jelas.

Workflow yang akan kita buat:

n8n Form Trigger -> Supabase Insert

Target akhirnya sederhana: user mengisi form intake, n8n menerima submission, lalu n8n menyimpan data tersebut sebagai row baru di tabel Supabase.

1. Gambaran Arsitektur

Sebelum masuk ke langkah teknis, pahami dulu alurnya:

Komponen Peran
n8n Form Trigger Membuat halaman form dan menangkap submission user
n8n workflow Menjadi proses server-side yang menerima data dan menjalankan automasi
Supabase Menyediakan database Postgres untuk menyimpan data
Table lead_intake Tempat penyimpanan data form
Row Satu submission form yang berhasil disimpan

Alurnya seperti ini:

  1. User membuka form dari URL n8n.
  2. User mengisi name, email, dan kebutuhan.
  3. n8n Form Trigger menerima data.
  4. Supabase node melakukan insert ke tabel lead_intake.
  5. Supabase menyimpan data sebagai row baru.

Catatan penting: jangan pernah menaruh API key, service role key, password, atau JWT di artikel, screenshot publik, atau workflow JSON yang dibagikan. Simpan secret di credential manager n8n.

2. Prasyarat

Sebelum mulai, pastikan Anda sudah punya:

  1. n8n yang sudah berjalan.
  2. Akun Supabase Cloud atau instance Supabase self-hosted.
  3. Akses ke dashboard Supabase.
  4. Hak untuk membuat table dan mengatur credential di n8n.

Placeholder yang akan kita gunakan:

Placeholder Arti
[SUPABASE_URL] URL project Supabase Anda
[REDACTED] Key atau secret yang tidak boleh ditampilkan

3. Setup Supabase Cloud

Jika memakai Supabase Cloud, lakukan langkah berikut:

  1. Buka dashboard resmi Supabase.
  2. Buat account jika belum punya.
  3. Buat project baru.
  4. Pilih region dan konfigurasi project sesuai kebutuhan.
  5. Pilih subscription yang sesuai kebutuhan.
  6. Cek pricing resmi Supabase sebelum berlangganan, karena detail harga dan limit bisa berubah.
  7. Catat Project URL, tetapi jangan tampilkan secret di dokumentasi publik.

Contoh format yang aman untuk dicatat di dokumentasi internal:

SUPABASE_URL=[SUPABASE_URL]
SUPABASE_KEY=[REDACTED]

Jangan menulis key asli di artikel, repository publik, issue tracker, atau chat yang tidak aman.

4. Buat Tabel lead_intake

Di Supabase SQL Editor, buat tabel sederhana berikut:

create table if not exists public.lead_intake (
  id uuid primary key default gen_random_uuid(),
  name text not null,
  email text not null,
  kebutuhan text,
  created_at timestamptz not null default now(),
  constraint lead_intake_email_length check (char_length(email) <= 320),
  constraint lead_intake_name_length check (char_length(name) <= 120),
  constraint lead_intake_kebutuhan_length check (char_length(kebutuhan) <= 2000)
);

Kolom yang kita pakai:

Kolom Tipe Keterangan
id uuid Primary key otomatis
name text Nama pengisi form
email text Email pengisi form
kebutuhan text Kebutuhan atau pesan dari user
created_at timestamptz Waktu data masuk

5. Catatan Aman tentang RLS

Supabase mendukung Row Level Security atau RLS. Untuk production, jangan menjadikan solusi permanen dengan mematikan RLS hanya supaya insert berhasil.

Ada dua pendekatan yang umum:

  1. Server-side melalui n8n dengan credential manager

    • n8n menyimpan credential secara aman.
    • Form user tidak langsung memanggil Supabase dari browser.
    • Jika memakai key dengan privilege tinggi seperti service role, pastikan hanya digunakan server-side dan tidak pernah diekspos ke client.

  2. Policy minimum untuk insert

    • Cocok jika Anda memakai key dengan privilege terbatas.
    • Policy harus dibuat seminimal mungkin.
    • Tetap butuh validasi, rate limit, dan monitoring.

Contoh policy insert sederhana jika Anda memang memilih jalur anon role untuk kebutuhan tertentu:

alter table public.lead_intake enable row level security;

create policy server_insert_leads
on public.lead_intake
for insert
to anon
with check (
  name is not null
  and email is not null
  and char_length(name) <= 120
  and char_length(email) <= 320
);

Catatan saya: policy seperti ini masih harus disesuaikan dengan model security aplikasi Anda. Untuk production yang serius, diskusikan role, key, dan policy dengan tim yang memahami Supabase dan Postgres security.

6. Opsi Self-hosted Supabase

Selain Cloud subscription, Supabase juga bisa dijalankan secara self-hosted. Namun, self-hosted bukan sekadar install lalu selesai.

Jika memilih self-hosted, tim Anda bertanggung jawab atas:

  • VPS atau server.
  • Docker dan konfigurasi service.
  • Storage.
  • Database.
  • Backup.
  • Patching.
  • HTTPS.
  • Monitoring.
  • Recovery saat terjadi masalah.

Pilihan ini menarik jika Anda butuh kontrol lebih besar, tetapi konsekuensi operasionalnya juga lebih besar. Jangan hanya membandingkan dari harga awal. Pertimbangkan waktu tim, risiko downtime, backup, security, dan kemampuan recovery.

Jika ingin opsi managed self-hosted, Anda bisa berkonsultasi atau membeli layanan melalui BOC di:

https://boc.co.id/supabase.php

BOC di sini adalah opsi penyedia managed self-hosted yang diarahkan dalam konteks tutorial ini, bukan sumber resmi Supabase. Detail kapasitas, harga, SLA, backup, dan scope layanan harus dikonfirmasi langsung di halaman atau ke penyedia terkait.

7. Buat Workflow n8n

Sekarang masuk ke n8n.

Buat workflow baru dengan dua node:

  1. n8n Form Trigger
  2. Supabase

Strukturnya:

n8n Form Trigger -> Supabase Insert

8. Konfigurasi n8n Form Trigger

Tambahkan node n8n Form Trigger.

Buat field berikut:

Field key Label Tipe Wajib
name Name Text Ya
email Email Email atau Text Ya
kebutuhan Kebutuhan Textarea Tidak, tetapi disarankan

Gunakan field key yang konsisten dengan nama kolom Supabase agar mapping lebih mudah.

Saat development, gunakan Test URL dari Form Trigger. Ini membantu karena data submission bisa terlihat di editor n8n saat testing.

Setelah workflow siap untuk production:

  1. Simpan workflow.
  2. Aktifkan atau publish workflow sesuai mode deployment n8n Anda.
  3. Gunakan Production URL.

Perlu diingat, data dari Production URL tidak selalu tampil di editor seperti mode test. Untuk verifikasi production, cek execution log dan row di Supabase.

9. Buat Credential Supabase di n8n

Tambahkan credential Supabase di n8n.

Isi credential dengan pola aman berikut:

Host atau URL: [SUPABASE_URL]
API Key: [REDACTED]

Jangan menaruh key asli di:

  • Nama node.
  • Catatan workflow.
  • Workflow JSON yang diekspor.
  • Artikel publik.
  • Screenshot.

Jika n8n Anda dipakai oleh tim, batasi siapa yang bisa melihat, mengubah, atau mengeksekusi credential.

10. Tambahkan Supabase Node untuk Insert Row

Tambahkan node Supabase setelah Form Trigger.

Konfigurasi umumnya:

Opsi Nilai
Credential Credential Supabase yang baru dibuat
Resource Row
Operation Insert atau Create, tergantung versi node n8n Anda
Table lead_intake

Nama operation bisa sedikit berbeda antar versi n8n. Di beberapa versi, action untuk menambahkan data disebut Insert. Di versi lain, UI bisa menampilkan istilah yang mirip seperti Create. Intinya, pilih operasi yang membuat row baru di tabel.

11. Mapping Field Form ke Kolom Supabase

Map data dari Form Trigger ke kolom Supabase.

Jika field key di Form Trigger adalah name, email, dan kebutuhan, gunakan expression berikut:

Kolom Supabase Expression n8n
name ={{ $json.name }}
email ={{ $json.email }}
kebutuhan ={{ $json.kebutuhan }}

Kolom id dan created_at tidak perlu diisi dari n8n karena sudah punya default value dari database.

Expected payload yang masuk ke Supabase kira-kira seperti ini:

{
  "name": "Budi",
  "email": "[email protected]",
  "kebutuhan": "Saya ingin konsultasi automasi lead intake."
}

Contoh di atas hanya payload dummy. Jangan gunakan data pribadi asli saat menulis dokumentasi publik.

12. Uji Submission

Lakukan pengujian:

  1. Klik Execute Workflow atau jalankan Form Trigger dalam mode test.
  2. n8n akan membuka form.
  3. Isi data contoh.
  4. Submit form.
  5. Pastikan node Supabase berhasil dieksekusi.
  6. Buka Supabase Table Editor.
  7. Cek tabel lead_intake.

Expected result:

  • Ada satu row baru di tabel lead_intake.
  • Kolom name terisi sesuai input form.
  • Kolom email terisi sesuai input form.
  • Kolom kebutuhan terisi sesuai input form.
  • Kolom created_at otomatis terisi timestamp.

Jika sudah berhasil, Anda sudah punya workflow intake sederhana yang datanya masuk ke database eksternal.

13. Troubleshooting

Berikut masalah yang sering muncul saat menghubungkan n8n ke Supabase.

Masalah Kemungkinan penyebab Solusi
Supabase node gagal koneksi URL salah Pastikan memakai [SUPABASE_URL] project yang benar
Unauthorized atau forbidden Key salah atau privilege tidak cukup Cek credential di n8n dan policy Supabase
Insert ditolak RLS policy belum sesuai Jangan mematikan RLS permanen, buat policy minimum yang tepat
Kolom tidak ditemukan Nama kolom berbeda Cocokkan field mapping dengan schema tabel
Data kosong Expression salah Cek output Form Trigger dan sesuaikan {{ $json.field }}
Error HTTPS Endpoint tidak memakai HTTPS atau sertifikat bermasalah Pastikan URL Supabase valid dan HTTPS berfungsi
Timeout Koneksi lambat atau server bermasalah Cek network, resource server, dan log n8n
Production URL tidak terlihat di editor Perilaku production Form Trigger Cek execution log dan database, bukan hanya editor UI

Tips saya: saat debugging, mulai dari mode test. Pastikan output Form Trigger benar dulu, baru cek Supabase node.

14. Security Checklist

Sebelum workflow dipakai production, cek daftar berikut:

  • Terapkan least privilege untuk key dan role.
  • Service role key hanya boleh digunakan server-side.
  • Simpan secret di credential manager n8n.
  • Jangan membagikan workflow JSON yang berisi secret.
  • Gunakan HTTPS.
  • Aktifkan dan desain RLS dengan benar.
  • Validasi input, minimal panjang teks dan format email.
  • Tambahkan rate limit jika form dibuka publik.
  • Siapkan backup database.
  • Cek audit log atau log akses sesuai kebutuhan compliance.
  • Tentukan data retention, misalnya data lead disimpan berapa lama.
  • Batasi akses dashboard Supabase dan n8n hanya untuk user yang perlu.
  • Monitor error execution di n8n.

Automasi yang terlihat sederhana bisa menjadi pintu masuk data penting. Karena itu, jangan menunda urusan security sampai datanya sudah terlanjur banyak.

15. Cloud Subscription vs Self-hosted Supabase

Berikut perbandingan jujur sebelum memilih:

Aspek Supabase Cloud Self-hosted Supabase
Setup awal Lebih cepat melalui dashboard resmi Lebih teknis, perlu server dan konfigurasi
Operasional Banyak dikelola platform Ditanggung tim sendiri atau penyedia managed
Kontrol infrastruktur Lebih terbatas Lebih besar
Backup dan recovery Mengikuti fitur dan paket yang dipilih Harus dirancang dan diuji sendiri
Security patching Banyak bergantung pada platform Tanggung jawab tim atau penyedia managed
Biaya awal Tergantung subscription Bisa terlihat murah, tetapi ada biaya operasional
Cocok untuk Tim yang ingin fokus build produk Tim yang butuh kontrol lebih dan siap operasional

Saya biasanya menyarankan memilih berdasarkan kebutuhan kontrol, security, backup, dan kemampuan operasional tim, bukan hanya harga awal. Untuk banyak proyek, Cloud lebih cepat untuk mulai. Untuk kebutuhan tertentu, self-hosted bisa masuk akal jika tim siap mengelola konsekuensinya.

16. Penutup

Di tutorial ini, kita membuat workflow sederhana tetapi fondasional:

n8n Form Trigger -> Supabase Insert

Hasilnya, data form tidak lagi berhenti di workflow atau Data Table, tetapi masuk ke database eksternal yang lebih terstruktur.

Jika Anda ingin cepat mulai, Supabase Cloud bisa menjadi opsi praktis. Jika butuh kontrol lebih besar, self-hosted bisa dipertimbangkan, dengan catatan tim harus siap mengurus VPS, Docker, storage, database, backup, patching, HTTPS, monitoring, dan recovery.

Untuk pembaca yang ingin opsi managed self-hosted, Anda bisa berkonsultasi atau membeli layanan melalui BOC di https://boc.co.id/supabase.php. Pastikan semua detail kapasitas, harga, SLA, backup, dan scope layanan dikonfirmasi langsung sebelum mengambil keputusan.

Referensi

  1. n8n Form, n8n Docs
    Penerbit: n8n
    URL: https://docs.n8n.io/integrations/builtin/core-nodes/n8n-nodes-base.formtrigger/
    Tanggal publish/update sumber: tidak terverifikasi.

  2. Supabase node, n8n Docs
    Penerbit: n8n
    URL: https://docs.n8n.io/integrations/builtin/app-nodes/n8n-nodes-base.supabase/
    Tanggal publish/update sumber: tidak terverifikasi.

  3. Getting Started, Supabase Docs
    Penerbit: Supabase
    URL: https://supabase.com/docs/guides/getting-started
    Tanggal publish/update sumber: tidak terverifikasi.

  4. Supabase VPS Hosting BOC
    Penerbit: BOC
    URL: https://boc.co.id/supabase.php
    Tanggal publish/update sumber: tidak terverifikasi.