FluentStack

Uji Kompetensi Auth and Browser Security Boundaries

Mode tersedia: dark, light, paper
MasukDaftar
Advanced · Level 18: Backend Basics for Frontend EngineersAdvanced90 menitBahasa Indonesia

Uji Kompetensi Auth and Browser Security Boundaries

Checkpoint untuk mendiagnosis symptom auth/browser secara defensif dan mengkomunikasikan boundary frontend, server, serta provider dengan jelas.

StatusMemuat progres
ReadinessMemuat...

...

Memuat progres

Menyiapkan langkah berikutnya

Yang dicek

  • Membedakan authentication, authorization, CORS, CSRF, dan cookie issue dari symptom frontend
  • Menentukan bukti aman yang dapat dikumpulkan melalui DevTools
  • Menjelaskan secure cookie attributes tanpa menyalin credential
  • Menyusun escalation note yang tidak mengklaim frontend dapat memverifikasi server security
AuthenticationCookiesCORSCSRFDebuggingReadiness Checkpoint

Isi lesson

6 blok
  1. 1.
    Checkpoint: diagnosis dimulai dari boundary yang tepatBelum selesaiWajib
  2. 2.
    QuizBelum selesaiWajib
  3. 3.
    Coding practiceBelum selesaiWajib
  4. 4.
    Writing practiceBelum selesaiWajib
  5. 5.
    Gunakan docs untuk membaca browser boundary dan auth contractBelum selesaiWajib
  6. 6.
    RingkasanBelum selesaiWajib

Checkpoint: diagnosis dimulai dari boundary yang tepat

Wajib

Course Admin dapat login, tetapi setelah refresh dashboard request profile kadang signed out. Pada staging, app berada di https://app.example.com dan API di https://api.example.com. Network panel menunjukkan request profile memakai credentials. Pada kasus lain, user signed in mendapat 403 saat membuka organization berbeda. Form create note dapat menerima 422 error field. Team juga menanyakan apakah cookie session memiliki HttpOnly, Secure, SameSite, serta expiry yang sesuai deployment.

Checkpoint ini tidak meminta kamu memperbaiki server, membuat token, atau mencoba bypass browser policy. Petakan dahulu apakah symptom berkaitan dengan identity/session, authorization, CORS, CSRF protection, validation, atau UI cache. Kumpulkan endpoint, origin, method, status atau console error, cookie attributes tanpa value, dan environment. Lalu jelaskan owner yang perlu memeriksa contract berikutnya.

Bagian ini memengaruhi progres lesson.

Quiz

Wajib

Uji Kompetensi Auth and Browser Security Boundaries

Jawab pertanyaan satu per satu. Kamu bisa ulang quiz jika belum mencapai target lulus.

Target lulus

70/100

Skor terbaik

0/100

Status

Belum dikerjakan

Blok ini wajib untuk menyelesaikan lesson. Progres quiz naik setelah skor mencapai target lulus.

Pertanyaan 1 dari 6

Target lulus: 70

User signed in tetapi mendapat 403 saat membuka organization lain. Ini paling dekat dengan

Coding practice

WajibDibuka di workspace khusus

Diagnose auth browser boundary checkpoint

Map symptom auth/browser ke recovery frontend dan owner boundary tanpa menjalankan request atau menyimpan credential.

Tujuan awal: Fokus di tab TS.

Practice ini dibuka di workspace khusus. Buka practice untuk memakai editor, preview, dan cek otomatis.

Tombol selesai aktif setelah semua validasi wajib lolos.

5 cek otomatis4 checklist
Belum selesaiBuka practice

Writing practice

Wajib

Latihan menulis

Tulis auth debugging note untuk kasus Course Admin. Jelaskan symptom UI, endpoint/method/origin yang diperiksa, perbedaan kemungkinan 401, 403, CORS block, atau session issue, cookie attributes yang aman dicatat tanpa value, hubungan CSRF dengan mutation cookie-based, dan owner atau docs yang perlu memeriksa server-side contract. Tambahkan satu local QA scenario serta satu informasi yang tidak boleh dibagikan.

Tulis draft dulu sebelum menandai writing practice selesai.

Draft kosong

0/750 karakter

Checklist panduan

Checklist ini hanya panduan. Kamu tidak harus mencentang semuanya.

Blok ini wajib untuk menyelesaikan lesson.

Documentation Bridge

Wajib

Gunakan docs untuk membaca browser boundary dan auth contract

Pilih docs sesuai symptom yang sedang diuji. Fokus pada behavior request dan cookies yang dapat dilihat frontend; abaikan implementasi crypto, exploit, atau custom auth server.

MDN Web Docs

Using HTTP cookies

Fokus baca

  • Set-Cookie dan Cookie pada flow session.
  • HttpOnly, Secure, SameSite, scope, dan expiry.
  • DevTools inspection tanpa membagikan value.

Abaikan dulu

  • Tracking implementation dan cookie prefix detail yang belum dipakai project.
Buka dokumentasi

MDN Web Docs

Cross-Origin Resource Sharing

Fokus baca

  • Origin, preflight, credentials, dan response policy.
  • Membedakan CORS browser error dari HTTP response.

Abaikan dulu

  • Menulis proxy atau bypass policy tanpa owner server.
Buka dokumentasi

MDN Web Docs

Same-origin policy

Fokus baca

  • Mengapa browser membatasi cross-origin read.
  • Hubungan same-origin policy dan CORS.

Abaikan dulu

  • Detail isolasi browser yang tidak muncul pada feature saat ini.
Buka dokumentasi

OWASP

CSRF Prevention Cheat Sheet

Fokus baca

  • CSRF sebagai unwanted authenticated request.
  • Defense in depth dan server-side validation concept.

Abaikan dulu

  • Attack payload, bypass technique, dan framework implementation detail.
Buka dokumentasi

OWASP

Authentication Cheat Sheet

Fokus baca

  • Authentication versus session management.
  • TLS dan error response sebagai product/security concern.

Abaikan dulu

  • Password hashing, OAuth provider, MFA, dan identity provider implementation.
Buka dokumentasi

Aksi setelah membaca

Di local atau staging app yang aman, trace satu sign-in sampai request protected page. Catat endpoint, origin, status, cookie attributes tanpa value, UI setelah refresh, serta owner contract yang perlu dicek. Coba failure yang aman seperti sign-out atau route tanpa permission. Jangan membuat token, menonaktifkan browser protection, atau membagikan credential.

Bagian ini memengaruhi progres lesson.

Ringkasan

Wajib
  • Authentication, session, authorization, CORS, CSRF, dan cookie attributes memiliki peran berbeda.
  • Frontend mendiagnosis symptom serta evidence aman; server/provider menegakkan security contract.
  • Cookie value, token, password, secret, dan raw credential tidak boleh masuk issue atau log client.
  • CORS browser block, HTTP status, dan CSRF protection tidak dapat disamakan.
  • Kamu siap melanjutkan ke Data and Infrastructure Basics untuk memahami storage serta service yang berada di balik contract frontend.

Bagian ini memengaruhi progres lesson.

Langkah berikutnya

Selesaikan bagian wajib checkpoint ini

Lanjutkan blok wajib berikutnya: Checkpoint: diagnosis dimulai dari boundary yang tepat.