Browser Security Internals: Origins, CORS & Attack Vectors
Explore browser security from first principles: origin computation, Same-Origin Policy enforcement, CORS preflight and simple request flows, credentialed requests, cookie security attributes (SameSite, HttpOnly, Secure), CSRF attack mechanics, XSS injection contexts, and Content Security Policy enforcement.
See the Invisible
Interactive simulators visualise what's hidden from view.
Hands-On Labs
Step through executions tick by tick. Manipulate state.
Why, Not Just What
Understand the reasoning behind every design decision.
Quizzes & Cheatsheets
Verify your understanding and keep a quick reference handy.
Get Certified
Earn a shareable certificate to prove your deep expertise.
Become the Engineer Who Supervises AI
As AI generates more code, understanding what that code does becomes more valuable, not less. Someone must verify AI output, debug failures, and make architectural decisions.
Build Your Architectural EdgeEvery CORS header, cookie attribute, and CSP directive you ship triggers browser enforcement you've never seen
Security configuration by trial and error
You've added Access-Control-Allow-Origin headers until
the console went quiet, set SameSite=Lax because a blog
post recommended it, and accepted AI-generated CSP directives
without knowing what they actually permit. When a CORS preflight
fails in production or a security audit flags your cookie scope,
you're patching symptoms because you can't see the system. The
browser evaluates origin tuples, runs preflight negotiations, and
enforces cookie transmission rules on every request, and without a
working model of that enforcement, every configuration change is a
guess.
See the invisible security layer in action
Interactive simulations make browser enforcement visible, step by step.
Watch origin comparisons execute
See how the browser evaluates scheme, host, and port tuples in real time, so you can diagnose cross-origin blocks instantly instead of guessing at header values.
Step through CORS negotiations
Trace every header in a preflight OPTIONS exchange and see exactly which condition caused the browser to grant or reject access, so you configure CORS correctly the first time.
Trace attack and defense flows
Watch a CSRF exploit ride ambient cookie authority or an XSS
payload execute inside a victim's origin, then see how
SameSite defaults and CSP directives intercept
each vector.
What's Covered
From origin computation through attack vectors and their defenses: the full browser security enforcement model.
Diagnose cross-origin access failures by understanding how
the browser computes and compares
scheme://host:port tuples, and which types of
cross-origin interactions SOP permits vs. blocks.
Configure CORS headers correctly the first time by tracing simple request criteria, preflight negotiations, and the strict rules governing credentialed cross-origin requests with ambient cookie authority.
Set Secure, HttpOnly, and
SameSite attributes that match your actual
security requirements, and verify that your defenses hold
against CSRF attacks that exploit ambient authority.
Identify the parser contexts where XSS payloads execute, and
build CSP policies with nonce-based allowlists and
strict-dynamic propagation that block execution
even when injection occurs.
The Curriculum
Comprehensive Lessons! Each with theory, interactive simulation, and quiz.
Origin Computation and Trust Boundaries
How the browser computes an origin from the
scheme://host:port tuple and uses it to
define isolated execution contexts. Covers edge cases
including HTTP vs. HTTPS, implicit vs. explicit ports,
and subdomain isolation. You'll see how the browser
compares origin tuples on every cross-context access
attempt.
Same-Origin Policy (SOP) Enforcement Mechanics
The asymmetric rules that make SOP far more nuanced than
a blanket cross-origin block. Why the browser permits
cross-origin writes (form POSTs, redirects) and
cross-origin embedding (images, scripts) while strictly
blocking cross-origin reads (DOM access, fetch response
inspection). Covers per-origin isolation of
localStorage and IndexedDB.
CORS Preflight and Simple Request Flows
How CORS explicitly relaxes the Same-Origin Policy
through server-granted permissions. The criteria that
classify a request as "simple" (limited methods,
specific Content-Type values like
application/x-www-form-urlencoded, and
CORS-safelisted headers) vs. those requiring an OPTIONS
preflight. Traces the full negotiation including
Access-Control-Request-* and
Access-Control-Allow-Origin headers.
Credentialed CORS and Ambient Authority
How ambient authority works: the browser automatically
attaches cookies to outbound requests based on the
destination domain, not the requesting origin. The
strict CORS rules for credentialed cross-origin
requests, including why wildcard * in
Access-Control-Allow-Origin is prohibited
and
Access-Control-Allow-Credentials: true is
required.
Cookie Security Attributes and Transmission Scope
How Set-Cookie attributes modify cookie
behavior at the browser level. The
Secure flag restricting transmission to
HTTPS, the HttpOnly flag blocking
document.cookie access, and
SameSite enforcement (Strict, Lax, None)
controlling cookie attachment across top-level
navigations vs. subresource requests.
CSRF Mechanics and State Modification
How Cross-Site Request Forgery exploits ambient cookie
authority combined with SOP's permission of cross-origin
writes. Traces the full attack flow where an
attacker-controlled origin triggers an authenticated
state-changing POST to a target. Covers the modern
defense via SameSite=Lax defaults and the
fallback mechanics of anti-CSRF synchronization tokens.
XSS Execution and Injection Contexts
How Cross-Site Scripting achieves code execution within a victim's trusted origin, bypassing origin boundaries entirely. Covers how the browser parser interprets input differently across HTML element contexts, HTML attribute contexts, and JavaScript string contexts. Examines the distinct mechanics of Reflected, Stored, and DOM-based XSS vectors.
Content Security Policy (CSP) Enforcement
How CSP provides defense-in-depth by restricting code
execution and resource loading regardless of injection
vectors. Covers directive evaluation for
default-src, script-src, and
connect-src. Examines nonce-based inline
script allowance,
strict-dynamic propagation, and violation
reporting via the report-to directive and
Reporting-Endpoints header.
A working model of browser security enforcement, from origin computation to CSP
You'll configure CORS headers, cookie attributes, and CSP directives knowing exactly what the browser does with each one. When a cross-origin request fails or a security review questions your setup, you'll trace the enforcement flow and explain why it works, not guess at another header combination.
Ready to see what's really happening?
All deep dives included with your subscription. Cancel anytime.