Header Content-Type: Label Wajib Setiap Body

Label pada setiap paket

Setiap paket yang dikirim kurir punya label: "mudah pecah", "makanan", "dokumen". Tanpa label, penerima harus menebak isi dan cara membukanya. Header Content-Type adalah label untuk body HTTP: ia memberitahu penerima format isi body, sehingga tahu cara mem-parse-nya.

Kenapa Content-Type sering jadi sumber error

Banyak error misterius ("server tidak membaca body saya!") ternyata karena Content-Type lupa diset atau salah. Server menerima body JSON tapi mengira itu teks biasa, lalu gagal memproses. Satu baris header ini adalah kontrak antara pengirim dan penerima tentang "bahasa" isi paket.

Contoh 1: Content-Type pada request

POST /api/produk HTTP/1.1
Host: toko.contoh.id
Content-Type: application/json

{"nama": "Kopi Susu"}

POST /api/upload HTTP/1.1
Host: toko.contoh.id
Content-Type: multipart/form-data; boundary=---abc123

-----abc123
Content-Disposition: form-data; name="foto"; filename="kopi.jpg"
...

Dua request, dua Content-Type berbeda: JSON untuk data terstruktur, multipart untuk upload file. Server membaca header ini dulu sebelum memutuskan cara parse body.

Contoh 2: Content-Type pada response

HTTP/1.1 200 OK
Content-Type: application/json; charset=utf-8

{"nama": "Kopi Susu"}

HTTP/1.1 200 OK
Content-Type: text/html; charset=utf-8

<html>...</html>

Bagian charset=utf-8 memberitahu encoding karakter. Tanpa charset yang benar, teks Indonesia bisa tampil sebagai karakter aneh (mojibake). Di fetch(), pilih pembaca body sesuai Content-Type: .json() untuk JSON, .text() untuk teks/HTML, .blob() untuk file.

Kesalahan umum

Salah: lupa Content-Type saat POST JSON. Server tidak tahu body itu JSON. Yang benar: selalu sertakan Content-Type: application/json.

Salah: set Content-Type manual saat pakai FormData. Browser harus mengisi boundary otomatis; boundary manual merusak format. Yang benar: jangan set Content-Type untuk FormData, biarkan browser.

Salah: mengabaikan charset. Teks beraksen atau emoji rusak tampilannya. Yang benar: selalu pakai charset=utf-8 untuk konten teks.

Salah: percaya Content-Type dari user untuk keamanan. File .jpg dengan Content-Type palsu bisa berisi script. Yang benar: server harus memvalidasi isi file sungguhan, bukan hanya header.

Daftar MIME yang sering dipakai

Catatan: application/x-www-form-urlencoded adalah format default form HTML tanpa enctype khusus (data seperti nama=Omni&umur=18). Kalau backend-mu menerima form klasik, inilah Content-Type yang harus kamu kenali.

Catatan teknis: Daftar tipe MIME umum: application/json, text/html, text/css, application/javascript, image/png, image/jpeg, application/pdf. Daftar lengkapnya dikelola IANA, tapi untuk sehari-hari menghafal enam ini sudah cukup.