Status 3xx: Redirect dan Cache
Cara kerja 301, 302, 304, dan kenapa redirect chain yang panjang bikin web lambat.
Papan "kami pindah" di depan toko
Kamu datang ke toko langganan, tapi di pintunya ada papan: "Kami pindah ke ruko sebelah, ikuti panah ini." Kamu pun diarahkan ke alamat baru. Itulah redirect: server tidak melayani request di alamat lama, tapi memberitahu alamat barunya lewat status code keluarga 3xx plus header Location.
Kenapa redirect harus ada
Alamat berubah adalah hal biasa: website ganti domain, halaman dipindah, atau HTTP di-upgrade ke HTTPS. Tanpa redirect, semua link lama di internet akan mati dan bookmark pengguna rusak. Redirect menjaga web tetap terhubung meski alamat berubah-ubah.
Contoh 1: 301, pindah permanen
GET /artikel-lama HTTP/1.1
Host: blog.contoh.idHTTP/1.1 301 Moved Permanently
Location: https://blog.contoh.id/artikel-baru301 berarti "selamanya pindah ke sana." Browser otomatis mengikuti ke URL baru, dan mesin pencari memindahkan ranking SEO ke alamat baru. Dipakai saat ganti domain atau migrasi HTTP ke HTTPS.
Contoh 2: 302 dan 307, pindah sementara
HTTP/1.1 302 Found
Location: https://blog.contoh.id/promo-oktober302 berarti "untuk sekarang ke sana dulu." Browser mengikuti tapi tidak mengingat permanen. Varian modernnya 307 menjaga method asli tetap sama (POST tetap POST setelah redirect), sedangkan 302 kadang diubah browser menjadi GET. Untuk API, pilih 307 atau 308 (versi permanen dari 307) agar method tidak berubah diam-diam.
Perilaku penting: fetch() dan browser mengikuti redirect secara otomatis, tapi Postman menampilkannya agar kamu sadar sedang di-redirect.
Kesalahan umum
Salah: redirect berantai terlalu panjang. A redirect ke B, B ke C, C ke D. Browser menyerah setelah sekitar 20 lompatan ("too many redirects"). Yang benar: arahkan langsung ke tujuan akhir, maksimal 1-2 lompatan.
Salah: memakai 302 untuk perubahan permanen. SEO dan cache tidak dipindahkan. Yang benar: 301/308 untuk permanen, 302/307 untuk sementara.
Salah: redirect setelah login ke URL yang bisa dimanipulasi. ?next=https://jahat.id adalah celah open redirect. Yang benar: validasi tujuan redirect hanya ke domain sendiri.
Panduan memilih kode redirect
| Situasi | Kode | Alasan |
|---|---|---|
| Pindah domain permanen | 301 | SEO dan bookmark ikut pindah |
| HTTP ke HTTPS | 301 | Permanen, aman |
| Halaman promo sementara | 302/307 | Akan kembali normal |
| API redirect tanpa ubah method | 307/308 | Method POST tetap POST |
Kesalahan paling mahal adalah memakai 302 untuk migrasi permanen: mesin pencari tidak memindahkan ranking, dan kamu kehilangan traffic organik selama berbulan-bulan tanpa sadar. Saat ragu untuk API, pilih 307 (sementara) atau 308 (permanen).
Catatan teknis: Status
304 Not Modifiedjuga keluarga 3xx tapi bukan redirect: artinya "konten tidak berubah, pakai cache-mu saja." Ini fondasi caching browser yang membuat web terasa cepat. Detail caching akan dibahas di level lanjut.
Tantangan
Intip redirect secara manual
Tulis kode fetch ke https://httpbin.org/redirect/2 dengan opsi redirect: "manual". Cetak:
- Status code yang diterima.
- Nilai header
Location.
Lalu ulangi tanpa opsi manual dan bandingkan status akhirnya. Jelaskan dengan kata-katamu apa yang dilakukan browser secara default terhadap redirect.
<!doctype html> <html> <head> <meta charset="utf-8" /> </head> <body> <h1>Halo JS</h1> <p>Buka console preview untuk melihat output.</p> <script src="index.js"></script> </body> </html>