Browser Security Model: How SOP, CORS, XSS and Cookies Actually Work
See the Invisible
Interactive simulators visualize what's hidden from view.
Hands-On Labs
Step through executions tick by tick. Manipulate state.
Why, Not Just What
Deep architectural understanding for mid-senior developers.
AI Sandbox Lab
Real-world scenarios. Find the flaws AI misses.
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 EdgeYou've read the MDN docs on CORS. You still get it wrong.
The browser makes dozens of security decisions every time your JavaScript touches the network, the DOM, or a cookie. SOP blocks this request but allows that one. CORS requires a preflight here but not there. Cookies attach automatically to some requests but not others. The rules seem arbitrary because you've never seen the decision logic the browser actually follows.
The confusion that causes vulnerabilities
- Thinking SOP prevents cross-origin requests (it doesn't, it prevents reading responses)
- Misconfiguring CORS credentials mode and leaking authenticated data
- Believing output encoding is context-independent
- Assuming SameSite=Lax blocks all CSRF vectors
What changes when you see the internals
- You see the origin comparison algorithm browsers execute on every cross-context access
- You trace the CORS preflight negotiation header by header
- You watch injection contexts parse identical input into code or text
- You follow cookie transmission decisions through SameSite logic
Interactive Simulators That Show Browser Decisions
Browser security is invisible. You send a request, it fails or succeeds, and you guess why. This course makes the decision logic visible. Each simulator shows you the exact algorithm the browser executes: origin computation from URLs, SOP enforcement across DOM/storage/network, CORS preflight exchanges, injection context parsing, and cookie transmission under SameSite policies.
Interactive Labs
Technical Deep-Dives
Security Domains
What You'll Master
Origin Model & Trust Boundaries
How browsers compute origins from URLs (scheme://host:port), compare them for same-origin status, and why this tuple defines every trust boundary in client-side security.
SOP Write vs Read Asymmetry
The browser allows cross-origin writes (form submissions, embedding resources) but blocks cross-origin reads (response data, DOM access, storage). This asymmetry explains most SOP confusion.
CORS Preflight Negotiation
When browsers send OPTIONS before the actual request, what triggers preflight (custom headers, non-simple methods), and the complete Access-Control header exchange that grants or denies access.
Credentialed CORS Rules
Why cookies with cross-origin requests require explicit opt-in from both client and server, why wildcards are forbidden with credentials, and how misconfiguration creates security holes.
XSS & Injection Context Parsing
How the same user input becomes executable code in HTML element context, attribute context, JavaScript string context, or URL context. Encoding depends entirely on where the output lands.
Cookie Ambient Authority & CSRF
Cookies attach based on destination domain, not request initiator. This ambient authority enables CSRF. SameSite Strict vs Lax vs None determines which cross-site requests carry cookies.
Course Curriculum
Visual cheatsheet
Practice verifying AI-generated code
Built for Engineers Who Review Security Configurations
Whether you're configuring CORS headers for a new API, reviewing CSP policies, debugging why cookies aren't being sent, or assessing XSS risk in a codebase, this course gives you the browser's perspective. You'll stop guessing at security behavior and start predicting it.
Ready to see what's really happening?
All deep dives included with your subscription. Cancel anytime.