daily.log
cd ../
Network·2026-01-26·3 min read·# entry/011

브라우저 동일 출처 정책(Same-Origin Policy, SOP)

브라우저의 동일 출처 정책(Same-Origin Policy, SOP)에 대해 알아본다.

개발을 하다 보면 이런 기이한 현상을 마주할 때가 있습니다.

"분명 A 서버의 UI와 B 서버의 UI는 다른 건데, 왜 localStorage에 저장된 데이터가 공유되는 거지?"

브라우저는 보안을 위해 각 웹사이트의 데이터를 철저히 격리합니다. 하지만 이 "격리"를 판단하는 기준은 우리가 생각하는 '서비스 단위'가 아니라, 철저하게 **Origin(출처)**이라는 기술적 기준을 따릅니다.

1. localStorage의 저장 기준: Origin (출처)

브라우저는 **Origin(출처)**이 같으면 "같은 집"이라고 판단하여 창고(localStorage, sessionStorage, Cookie)를 공유하게 해 줍니다.

여기서 Origin이 같으려면 아래 3가지 요소가 토씨 하나 틀리지 않고 일치해야 합니다.

1

1. Protocol (프로토콜)

통신 규약입니다.

  • http vs https는 서로 다릅니다.
2

2. Host (Domain)

주소(도메인)입니다.

  • naver.com vs google.com은 당연히 다릅니다.
  • www.naver.com vs blog.naver.com (서브 도메인)도 다릅니다.
3

3. Port (포트 번호)

접속하는 문(Door)입니다.

  • :80 (기본) vs :3000 vs :8080은 모두 다른 출처로 간주됩니다.
주의: Path(경로)는 무관합니다

가장 많이 하는 착각 중 하나입니다.

  • http://example.com/app1
  • http://example.com/app2

위 두 주소는 뒤의 **경로(Path)**가 다르지만, Protocol, Host, Port가 모두 같으므로 같은 Origin입니다. 따라서 localStorage를 공유합니다.

2. 예시로 보는 Same-Origin 판단

기준 데이터: http://store.company.com:80/dir/page.html

아래 주소들은 기준 데이터와 동일한 저장소를 사용합니다.

URL이유
http://store.company.com/dir2/other.htmlPath만 다름 (무관함)
http://store.company.com/dir/inner/another.htmlPath만 다름
http://store.company.com:80/...Port 명시 (기본값 일치)

3. 결론: 왜 공유되었을까?

질문하신 **"다른 서버의 UI인데 캐싱되어 있는 이슈"**의 원인은 다음과 같을 확률이 높습니다.

  1. 동일 도메인 사용: 서버(인스턴스)는 다르지만, 앞단의 로드밸런서나 Nginx 설정을 통해 같은 도메인, 같은 포트로 서빙되고 있을 경우. (브라우저 입장에서는 같은 사이트임)
  2. 경로만 다름: /admin, /user 처럼 경로로 서비스를 구분한 경우.
Solution

만약 데이터를 격리하고 싶다면 서브 도메인(admin.service.com, user.service.com)을 분리하거나, 데이터를 저장할 때 Key 값에 Prefix(admin_token, user_token)를 붙여 구분해야 합니다.