authbasic-authkeamananMahir3 mnt baca

Basic Auth: Cara Login Paling Sederhana

Cara kerja HTTP Basic Authentication, kenapa ia butuh HTTPS, dan kapan masih dipakai.

Memberi tahu nama dan kata sandi di setiap surat

Cara autentikasi paling tua di HTTP: setiap request menyertakan username dan password yang digabung lalu di-encode Base64 di header Authorization. Namanya Basic Auth. Sederhana, didukung semua klien, dan tidak butuh mekanisme tambahan.

Kenapa Basic Auth masih relevan

Untuk kebutuhan internal dan cepat (webhook antar server, API sementara saat development, proteksi halaman staging), Basic Auth adalah solusi termudah: tidak perlu sistem login, tidak perlu database session. Server cukup memeriksa username-password di setiap request.

Contoh 1: bentuk request-nya

Username admin, password rahasia123 digabung menjadi admin:rahasia123, lalu di-encode Base64 menjadi YWRtaW46cmFoYXNpYTEyMw==:

http
GET /api/rahasia HTTP/1.1
Host: toko.contoh.id
Authorization: Basic YWRtaW46cmFoYXNpYTEyMw==

Server men-decode kembali, memeriksa ke daftar user, lalu memutuskan. Response sukses 200, gagal 401 dengan header WWW-Authenticate: Basic yang memicu popup login bawaan browser.

Contoh 2: di JavaScript

javascript
const username = "admin";
const password = "rahasia123";
const kredensial = btoa(username + ":" + password);

const response = await fetch("https://toko.contoh.id/api/rahasia", {
  headers: { "Authorization": "Basic " + kredensial }
});

Fungsi btoa() melakukan encode Base64 di browser. Simpel, tapi ingat keterbatasannya di bawah.

Kesalahan umum

Salah: mengira Base64 adalah enkripsi. Bukan. Base64 hanya mengubah tampilan, siapa pun bisa men-decode dalam sedetik. Yang benar: Basic Auth WAJIB lewat HTTPS; tanpa itu password-mu telanjang di jaringan.

Salah: memakai Basic Auth untuk aplikasi publik. Password dikirim di setiap request, memperbesar risiko bocor. Yang benar: untuk aplikasi user-facing, pakai token (modul berikutnya) yang bisa dicabut tanpa mengganti password.

Salah: menyimpan kredensial di frontend. Username-password yang tertanam di kode JavaScript bisa dibaca siapa pun. Yang benar: Basic Auth hanya untuk server-to-server atau proteksi sementara, bukan untuk kode yang dikirim ke browser user.

Kapan Basic Auth masih masuk akal

Jangan langsung membuangnya; ada kasus di mana Basic Auth adalah pilihan tepat:

  1. Proteksi halaman staging: satu username-password untuk seluruh tim, tanpa sistem login.
  2. Webhook antar server: dua server internal yang saling percaya.
  3. API sementara saat development: sebelum sistem token jadi.

Untuk ketiganya, syarat mutlak sama: WAJIB HTTPS, kredensial disimpan di environment variable (bukan di kode), dan password diganti berkala. Di luar tiga kasus ini, pakai token.

Alternatif modern untuk kasus staging: proteksi lewat VPN atau IP whitelist, bukan Basic Auth. Dan untuk webhook antar server, pertimbangkan signature HMAC (seperti modul webhook) yang lebih aman daripada password statis yang dikirim berulang-ulang.

Catatan teknis: Basic Auth bersifat stateless (tidak ada session), sehingga mudah diskalakan. Tapi karena password dikirim berulang-ulang, praktik modern menggantinya dengan API key atau token berumur pendek untuk hampir semua kasus.

Tantangan

Buat dan decode header Basic

Tanpa tools online:

  1. Dengan btoa, buat header Authorization Basic untuk username siswa password belajar123.
  2. Dengan atob, decode kembali hasilnya dan pastikan cocok dengan siswa:belajar123.
  3. Jawab: apa yang terjadi kalau string ini dikirim lewat HTTP biasa (bukan HTTPS)? Siapa yang bisa membacanya?
<!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>
Open on CodeSandboxOpen Sandbox