Tujuan Pembelajaran

Memahami 4 OAuth 2.0 grant types dan kapan menggunakan masing-masing
Mengerti flow Authorization Code, Implicit, Client Credentials, Resource Owner Password
Mampu menjelaskan kenapa Implicit flow deprecated dan kenapa PKCE wajib

Analogi

Diagram


      OAuth 2.0 = Valet Key Hotel:

Kamu (User) check-in ke hotel (Client App).
Hotel memberi valet key (Access Token) yang hanya bisa:
- Buka pintu mobil, bukan bagasi
- Hanya berlaku 24 jam
- Tidak bisa buka kamar hotel lain

Valet key ≠ Master key (password).
Kalau valet key dicuri, pencuri hanya bisa bawa mobil — bukan buka brankas.

OAuth seperti valet key hotel — kamu tidak memberikan password ke aplikasi pihak ketiga, tapi delegated access token dengan scope dan waktu terbatas.

Penjelasan Konsep

OAuth 2.0 adalah protokol authorization — BUKAN authentication. Ini adalah delegated access: kamu memberi izin aplikasi A untuk mengakses data kamu di aplikasi B, tanpa memberikan password ke aplikasi A.

Empat grant types: (1) Authorization Code — standard untuk server-side apps. User login di authorization server, dapat authorization code, ditukar dengan access token. Paling aman karena token tidak pernah exposed ke browser. (2) PKCE (Proof Key for Code Exchange) — wajib untuk SPA dan mobile apps. Extension Authorization Code yang mencegah authorization code interception. (3) Client Credentials — untuk machine-to-machine communication. Tidak ada user, client langsung auth dengan client_id + client_secret. (4) Resource Owner Password — deprecated. User memberikan username+password langsung ke client. JANGAN digunakan.

Kenapa Implicit flow deprecated (OAuth 2.1): access token langsung dikembalikan di URL fragment — bisa di-intercept oleh malicious JavaScript. PKCE + Authorization Code adalah replacement.

Components: Resource Owner (user), Client (aplikasi), Authorization Server (yang handle login), Resource Server (API yang menyimpan data). Token: Access Token (short-lived, untuk akses API), Refresh Token (long-lived, untuk dapat access token baru).

Inti yang Perlu Dipahami

Bagian ini berfokus pada memahami 4 OAuth 2.0 grant types dan kapan menggunakan masing-masing., mengerti flow Authorization Code, Implicit, Client Credentials, Resource Owner Password., dan mampu menjelaskan kenapa Implicit flow deprecated dan kenapa PKCE wajib. Jangan terburu-buru menghafal istilahnya. Lebih penting untuk memahami peran setiap konsep dan kapan konsep itu muncul dalam pekerjaan web development.

Saat membaca OAuth 2.0, gunakan tujuan belajar sebagai penanda arah. Kalau kamu sudah bisa menjelaskan tujuan itu dengan kata-katamu sendiri, berarti fondasinya mulai terbentuk.

Cara Membayangkannya

OAuth seperti valet key hotel — kamu tidak memberikan password ke aplikasi pihak ketiga, tapi delegated access token dengan scope dan waktu terbatas. Analogi ini dipakai supaya konsep teknis tidak terasa melayang. Hubungkan setiap istilah dengan perannya: siapa yang meminta, siapa yang memproses, data apa yang berpindah, dan hasil apa yang diharapkan.

Kalau analoginya sudah terasa masuk akal, barulah lihat istilah teknisnya. Cara ini membuat materi lebih mudah dipahami daripada langsung menghafal definisi.

Saat Melihat Contoh Kode

Contoh kode pada chapter ini memakai bahasa typescript. Bacalah contoh kode sebagai ilustrasi alur, bukan sebagai bagian yang harus langsung dihafal. PKCE flow: (1) Generate random code_verifier, (2) Hash jadi code_challenge, (3) Kirim challenge ke auth server, (4) Auth server verifikasi bahwa yang menukar code adalah yang sama yang meminta — via verifier.

Perhatikan nama fungsi, urutan langkah, dan data yang berpindah. Biasanya tiga hal itu sudah cukup untuk memahami hubungan antara teori dan praktik.

Konteks dalam Perjalanan Belajar

Setiap konsep di platform ini dipilih karena dipakai di industri. Fokus pada pemahaman, bukan hafalan.

Kamu sudah di bagian lanjutan. Mulai pikirkan bagaimana konsep ini dipakai di dunia kerja — bukan hanya untuk belajar, tapi untuk membangun produk nyata.

Gunakan pertanyaan reflektif dan prompt AI di akhir chapter sebagai latihan aktif. Membaca saja tidak cukup — kamu perlu menjelaskan ulang dengan kata-katamu sendiri.

Contoh Kode

typescript

// Authorization Code + PKCE flow (backend)
import crypto from 'crypto';

// Step 1: Generate code verifier & challenge
const codeVerifier = crypto.randomBytes(32).toString('base64url');
const codeChallenge = crypto
  .createHash('sha256')
  .update(codeVerifier)
  .digest('base64url');

// Step 2: Redirect user to authorization server
const authUrl = `https://auth.example.com/authorize?` +
  `response_type=code&` +
  `client_id=${CLIENT_ID}&` +
  `redirect_uri=${REDIRECT_URI}&` +
  `code_challenge=${codeChallenge}&` +
  `code_challenge_method=S256&` +
  `scope=openid profile email`;

// Step 3: Exchange code for tokens (callback handler)
const tokens = await fetch('https://auth.example.com/token', {
  method: 'POST',
  headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
  body: new URLSearchParams({
    grant_type: 'authorization_code',
    code: req.query.code,
    redirect_uri: REDIRECT_URI,
    client_id: CLIENT_ID,
    code_verifier: codeVerifier,
  }),
}).then(r => r.json());

Penjelasan Kode

PKCE flow: (1) Generate random code_verifier, (2) Hash jadi code_challenge, (3) Kirim challenge ke auth server, (4) Auth server verifikasi bahwa yang menukar code adalah yang sama yang meminta — via verifier.

Prompt AI

Jelaskan kenapa Implicit flow OAuth 2.0 sudah deprecated di OAuth 2.1. Apa vulnerability spesifik yang membuatnya tidak aman? Bagaimana PKCE menyelesaikannya?

Pertanyaan Reflektif

Cek aplikasi terakhirmu: pakai OAuth 2.0 flow yang mana? Apakah pakai Implicit (deprecated)? Kalau iya, refactor ke Authorization Code + PKCE.