Browser security boundaries
Understand the origin boundary
Use scheme, host, and port to reason about which documents and requests can share browser authority.
8 minute lesson
The browser uses an origin as a major security boundary. Scheme, host, and port must all match.
A page from https://app.flaviocopes.com has a different origin from https://api.flaviocopes.com. The same-origin policy restricts reading across origins, but it does not stop every cross-origin request from being sent. Design from the exact browser rule, not from “same company.”
https://app.flaviocopes.com and https://api.flaviocopes.com belong to the same company but not the same origin. A browser may send a cross-origin form while refusing JavaScript access to its response.
Saying “the browser blocks cross-origin requests” hides this important difference. Design separately for sending, reading, cookies, navigation, and other browser-controlled behavior.
Classify five URLs by scheme, host, and port, then test one cross-origin fetch() and one HTML form submission. Record whether each request was sent and whether the initiating page could read the response.
Lesson completed