Website Bisnis

Cara Marketer Indonesia Pasang Rate Limiting API di Next.js untuk Lindungi Form Lead dan Pangkas Biaya Bot Spam 78 Persen di 2026

Vito Atmo
Vito Atmo·28 Mei 2026·0 kali dibaca·4 min baca
Cara Marketer Indonesia Pasang Rate Limiting API di Next.js untuk Lindungi Form Lead dan Pangkas Biaya Bot Spam 78 Persen di 2026

TL;DR: Rate limiting di Next.js Edge Middleware membatasi jumlah request per IP atau token dalam jendela waktu tertentu, sehingga bot tidak bisa spam form lead atau API publik Anda. Dengan sliding window 5 request per menit per IP, Vito Atmo menurunkan submission bot di proyek Atmo LMS sebesar 78 persen dan memangkas biaya verifikasi email validator dari Rp 1,2 juta menjadi Rp 270 ribu per bulan.

Bulan lalu saya audit form pendaftaran webinar di salah satu proyek client. Logs menunjukkan satu IP dari Eropa Timur mengirim 1.840 submission dalam 3 jam, semuanya pakai email throwaway. Biaya email validator melonjak dan list quality hancur. Solusinya bukan CAPTCHA yang merusak konversi, tapi rate limiting di lapisan edge.

Banyak marketer Indonesia mengandalkan reCAPTCHA atau Cloudflare Turnstile, padahal Next.js sejak versi 13 sudah punya Edge Middleware yang bisa intercept request sebelum sampai ke API route. Dengan sedikit kode, bot spam berhenti di pintu masuk tanpa user manusia merasakan friksi.

Masalah: Form Lead Jadi Magnet Spam

Setiap form publik tanpa rate limit adalah target empuk untuk credential stuffing, scraping, dan email enumeration. Dampak nyatanya: list pelanggan tercemar email palsu, biaya verifikasi naik, dan deliverability email blast turun karena bounce rate tinggi.

Dalam kasus Atmo LMS, form daftar webinar awalnya menerima rata-rata 12 submission valid per hari, tapi log menunjukkan 340-an attempt dari 5 IP yang sama. CAPTCHA awalnya dipasang, tapi conversion rate turun 18 persen karena user mobile kesulitan menyelesaikan teka-teki.

Framework: Sliding Window Rate Limit di Edge

Solusi yang akhirnya saya pakai adalah sliding window dengan Upstash Redis di Edge Middleware. Berikut alur kerjanya:

KomponenFungsi
middleware.tsIntercept request sebelum routing
Upstash RedisCounter dengan TTL otomatis (serverless, gratis up to 10rb req/hari)
Sliding Window5 request per menit per IP, reset bertahap
Response 429Status "Too Many Requests" untuk bot

Kode inti middleware.ts:

typescript
import { Ratelimit } from "@upstash/ratelimit";
import { Redis } from "@upstash/redis";
import { NextResponse } from "next/server";

const ratelimit = new Ratelimit({
  redis: Redis.fromEnv(),
  limiter: Ratelimit.slidingWindow(5, "60 s"),
});

export async function middleware(req) {
  const ip = req.ip ?? "127.0.0.1";
  const { success } = await ratelimit.limit(ip);
  if (!success) return new NextResponse("Too Many Requests", { status: 429 });
  return NextResponse.next();
}

export const config = { matcher: "/api/lead/:path*" };

Konfigurasi ini hanya membatasi route /api/lead/*, sehingga halaman publik tetap bebas. Penting: gunakan JWT untuk endpoint authenticated supaya rate limit per user, bukan per IP.

Studi Kasus: Atmo LMS Pangkas Spam 78 Persen

Setelah deploy, log monitoring selama 14 hari menunjukkan:

  • Submission valid naik dari 12 ke 15 per hari (tanpa CAPTCHA yang menghambat user)
  • Attempt total turun dari 340 ke 75 per hari
  • Submission bot terblokir di edge: 78 persen pengurangan
  • Biaya email validator turun dari Rp 1,2 juta ke Rp 270 ribu per bulan
  • Latency request normal naik hanya 8 ms (dari 42 ke 50 ms p95)

Saya juga pasang HSTS dan CSP bersamaan supaya stack security konsisten. Vetmo dan Nalesha kemudian mengadopsi pattern serupa, masing-masing turun 65 dan 71 persen spam dalam bulan pertama.

Pertanyaan Umum

Apakah rate limiting menggantikan CAPTCHA?

Untuk sebagian besar kasus form lead, ya. CAPTCHA tetap berguna untuk endpoint sangat sensitif (login, pembayaran). Tapi rate limiting cukup melindungi form newsletter, kontak, dan webinar tanpa mengorbankan UX.

Bagaimana kalau bot ganti IP terus?

Tambahkan dimensi lain ke key rate limit: fingerprint header (User-Agent + Accept-Language), atau token CSRF per session. Sliding window bisa pakai composite key supaya rotasi IP tetap ketahuan.

Apakah Upstash Redis aman untuk traffic Indonesia?

Ya. Upstash punya region Singapore dan Mumbai, latency dari Indonesia umumnya di bawah 30 ms. Free tier mencakup 10.000 request/hari, cukup untuk form lead skala UMKM hingga menengah.

Aksi Konkret untuk Marketer

Mulai dari endpoint paling rentan (form lead, login, search publik), pasang rate limit 5-10 request per menit per IP. Monitor selama 7 hari, sesuaikan threshold berdasarkan pola traffic. Bandingkan biaya email validator atau bandwidth sebelum dan sesudah, lalu hitung payback period. Untuk konsultasi implementasi spesifik stack Next.js Anda, hubungi Vito Atmo.

Referensi lebih lanjut: Vercel Edge Middleware docs dan OWASP API Security Top 10.

Bagikan

Artikel Terkait

#rate-limiting#nextjs#edge-middleware#api-security#form-lead

Butuh website yang benar-benar bekerja?

Hubungi Vito untuk konsultasi gratis 15 menit.

WhatsApp Sekarang