💀 Same Origin Policy (SOP)

Hey there!

In this post, we’ll dive into the Same Origin Policy (SOP) — a crucial web security mechanism designed to prevent malicious attacks and protect user privacy.

---

🧠 What is SOP?

Same Origin Policy (SOP) is a security rule that restricts how scripts and resources on a webpage can interact.

It states that scripts (like JavaScript, CSS, or XHR) can only access data and resources that share the same origin as themselves.

---

🌍 What is an Origin?

An origin is defined by the combination of the following three elements:

- Scheme (Protocol): http or https

- Host: The domain name or IP address

- Port: The port number (commonly 80 for HTTP and 443 for HTTPS)

For example:

• http://store.company.com/dir/page.html

• http://store.company.com:2000/dir/page.html

These two URLs have different origins, because they use different ports (default 80 vs. 2000).

---

🔍 Examples of Same-Origin vs Cross-Origin

Reference URL: https://app.example.com:443/dashboard

https://app.example.com:443/profile (✅Same-Origin)
https://api.example.com:443/profile (❌Cross-Origin)
http://app.example.com:443/home (❌Cross-Origin)
https://app.example.com:3000/settings (❌Cross-Origin)
https://app.example.com/dashboard (✅Same-Origin)

Note: In SOP, only the scheme, host, and port define the origin—differences in the path or query parameters do not affect whether two URLs are considered same-origin.

---

🧩 Why is SOP Important?

SOP plays a vital role in maintaining web security.

It helps protect users from attacks like:

• Cross-Site Scripting (XSS)

• Cross-Site Request Forgery (CSRF)

---

💥 Example: XSS

Imagine you’re visiting a website that has been compromised by an attacker.

The attacker injects a malicious JavaScript payload.

Without SOP, this script could access sensitive data on other sites you’re logged into — like your banking credentials or passwords.

---

💸 Example: CSRF

Suppose you’re logged into your online banking account.

An attacker sends you a malicious link.

Without SOP, clicking that link could allow a hidden script to transfer funds from your account to the attacker’s — without your knowledge.

---

⚙️ Exceptions to SOP

Sometimes, scripts legitimately need to access resources from different origins.

To enable this securely, mechanisms like CORS (Cross-Origin Resource Sharing) are used, allowing controlled access to external resources.

---

📚 References

• MDN Docs – Same Origin Policy