Same-Origin Policy (SOP)
The Same-Origin Policy (SOP) is a fundamental browser security mechanism that restricts how a document or script loaded from one origin can interact with resources from a different origin. An origin is defined by the combination of protocol, host, and port.
The Same-Origin Policy is the cornerstone of web browser security. It prevents JavaScript running on one website from reading data from another website, which is essential for protecting user privacy and preventing data theft. Without SOP, any website you visit could read your email, access your banking information, or interact with any other authenticated web service in your browser.
Two URLs are considered to have the same origin only if their protocol (HTTP vs HTTPS), hostname (including subdomains), and port number all match exactly. For example, https://example.com and https://api.example.com are different origins, as are https://example.com and http://example.com. This strict definition ensures that even closely related but distinct services cannot access each other's data without explicit permission.
SOP applies to various browser mechanisms including XMLHttpRequest and Fetch API requests, DOM access between frames, Web Storage, and IndexedDB. However, some elements are exempt by design: images loaded via img tags, CSS loaded via link tags, and scripts loaded via script tags can be loaded cross-origin, though the loading page cannot read their content programmatically.
When legitimate cross-origin communication is needed, controlled mechanisms exist: CORS for HTTP requests, postMessage for inter-frame communication, and JSONP as a legacy approach. Understanding SOP is essential for web security because many vulnerabilities (XSS, CSRF, CORS misconfigurations) relate to bypassing or weakening this fundamental protection.