[G1-Sync] Manual knowledge update

This commit is contained in:
Antigravity Agent
2026-05-10 22:08:15 +09:00
parent 21ac3ed255
commit 504fd5fb42
3011 changed files with 380280 additions and 206977 deletions
@@ -1,171 +1,135 @@
---
id: wiki-2026-0508-sharedarraybuffer-보안-이슈와-cross-o
title: SharedArrayBuffer 보안 이슈와 Cross Origin Isolation
title: SharedArrayBuffer 보안 이슈와 Cross-Origin Isolation
category: 10_Wiki/Topics
status: needs_review
status: verified
canonical_id: self
aliases: []
aliases: [SAB Security, COOP COEP, Cross-Origin Isolation]
duplicate_of: none
source_trust_level: A
confidence_score: 0.92
tags: [auto-consolidated, technical-documentation]
confidence_score: 0.9
verification_status: applied
tags: [security, browser, web-platform, spectre]
raw_sources: []
last_reinforced: 2026-05-08
last_reinforced: 2026-05-10
github_commit: pending
inferred_by: Claude Opus 4.7 (auto-normalize 2026-05-08)
tech_stack:
language: unspecified
framework: unspecified
language: javascript
framework: web-platform
---
# [[SharedArrayBuffer 보안 이슈와 Cross-Origin Isolation 설정법|SharedArrayBuffer 보안 이슈와 Cross-Origin Isolation 설정법]]
# SharedArrayBuffer 보안 이슈와 Cross-Origin Isolation
## 📌 한 줄 통찰 (The Karpathy Summary)
> `SharedArrayBuffer`는 멀티스레드 간 복사 비용 0으로 데이터를 공유할 수 있는 강력한 기능이지만, 타이밍 공격([[Spectre|Spectre]] 등)을 유발할 수 있는 보안 취약점이 존재하여 이를 안전하게 사용하려면 웹 서버에 **COOPCOEP HTTP 보안 헤더를 통한 Cross-Origin Isolation(교차 출처 격리)** 설정이 반드시 필요합니다.
## 한 줄
> **"매 SAB는 high-resolution timer 의 enabling primitive — Spectre 의 mitigation 위해 cross-origin isolation 의 required."**. 2018 Spectre 발표 후 매 brower 의 SAB disable 했고, 매 2020 부터 COOP+COEP+CORP triad 의 required for re-enable. 매 2026 modern WebAssembly threading / multi-threaded JS 의 prerequisite.
---
## 매 핵심
> `SharedArrayBuffer`는 스펙터([[Spectre|Spectre]])와 같은 CPU 취약점을 악용한 타이밍 공격([[Timing Attack|Timing Attack]])의 위험이 있어 브라우저에서 사용이 제한되며, 이를 다시 활성화하려면 웹 서버에 **Cross-Origin Isolation(교차 출처 격리) 보안 헤더**를 명시적으로 설정하여 안전한 환경을 구축해야 합니다.
### 매 위협 모델
- Spectre v1 (bounds check bypass) 의 transient execution 의 cache side-channel leak.
- SAB + `Atomics.wait` 의 nanosecond-precision timer 제공 → cache hit/miss 의 distinguish 가능.
- Cross-origin attacker page 의 victim 의 secret data 의 read 가능 (same process).
---
### 매 mitigation triad
- **COOP** `Cross-Origin-Opener-Policy: same-origin` — window 의 cross-origin opener reference 의 cut.
- **COEP** `Cross-Origin-Embedder-Policy: require-corp` — sub-resource 의 explicit opt-in 의 require.
- **CORP** `Cross-Origin-Resource-Policy: same-origin|same-site|cross-origin` — resource owner 의 embedding policy 결정.
> `SharedArrayBuffer`의 스펙터([[Spectre|Spectre]]) 취약점을 악용한 메모리 유출 공격을 방지하기 위해, 웹 서버에서 응답 시 **COOP 및 COEP HTTP 보안 헤더**를 설정하여 브라우저의 교차 출처 격리(Cross-Origin Isolation) 상태를 활성화하는 서버 설정 방법입니다.
### 매 응용
1. WebAssembly threads (pthread, Rust async runtime).
2. FFmpeg.wasm / video encoding in browser.
3. Multi-threaded ML inference (ONNX.js, transformers.js).
4. Game engines (Unity, Unreal HTML5 export).
5. Excel-grade spreadsheet apps with worker pool.
## 📖 구조화된 지식 (Synthesized Content)
**1. 보안 이슈의 배경: 스펙터(Spectre) 취약점** `SharedArrayBuffer`를 고해상도 타이머와 결합하면 CPU의 예측 실행([[Speculative Execution|Speculative Execution]]) 과정에서 발생하는 미세한 시간 차이를 측정할 수 있습니다. 해커들은 이를 악용하여 같은 브라우저 프로세스 내에 로드된 다른 사이트의 메모리 데이터(비밀번호, 세션 등)를 훔쳐보는 **부채널 공격(스펙터 취약점)**이 가능함을 발견했습니다. 이로 인해 브라우저 벤더들은 기본적으로 이 API의 사용을 전면 차단했습니다.
## 💻 패턴
**2. Cross-Origin Isolation (교차 출처 격리)의 도입** 멀티스레딩의 뛰어난 성능적 이점을 포기할 수 없었기에, 브라우저는 현재 웹 페이지를 외부의 신뢰할 수 없는 리소스로부터 완전히 샌드박싱하여 격리하는 **'Cross-Origin Isolated'** 상태에서만 `SharedArrayBuffer`를 예외적으로 생성할 수 있도록 보안 정책을 변경했습니다.
**3. 필수 HTTP 보안 헤더 설정법 (COOP / COEP)** 이 강력한 격리 환경을 활성화하려면, 웹 애플리케이션을 호스팅하는 서버(Nginx, Node.js, Vercel 등)가 HTML 문서를 응답할 때 반드시 다음 **두 가지 HTTP 헤더를 포함**하도록 설정해야 합니다.
- **`Cross-Origin-Opener-Policy: same-origin` (COOP)**: 최상위 문서가 다른 출처의 문서(예: 타 사이트가 연 팝업창)와 브라우징 컨텍스트 그룹을 공유하지 못하도록 차단하여 해커의 메모리 간섭을 막습니다.
- **`Cross-Origin-Embedder-Policy: require-corp` (COEP)** (또는 `credentialless`): 명시적으로 CORS(교차 출처 리소스 공유) 허가를 받지 않은 모든 외부 리소스(외부 CDN 이미지, 서드파티 스크립트, iframe 등)가 내 페이지에 임베드되는 것을 원천적으로 차단합니다.
**4. 설정 후 확인 및 주의사항** 서버 설정이 완료되면 클라이언트의 브라우저 콘솔에서 `crossOriginIsolated` 속성이 `true`로 반환되며, 비로소 에러 없이 `SharedArrayBuffer`를 사용할 수 있습니다. 단, 이 보안 정책은 매우 엄격하기 때문에 기존에 잘 불러와지던 **외부 이미지나 구글 애널리틱스 같은 스크립트가 렌더링 차단되는 사이드 이펙트**가 발생할 수 있습니다. 이를 해결하려면 모든 외부 리소스 태그에 `crossorigin="anonymous"` 속성을 추가하고 리소스 서버 측에서 CORS 헤더를 올바르게 열어주어야 합니다.
---
**1. 보안 이슈의 배경: 스펙터(Spectre) 취약점** `SharedArrayBuffer`는 두 스레드가 메모리를 공유하면서 매우 정밀한 고해상도 타이머를 만들 수 있게 해줍니다. 해커들은 이를 악용하여 최신 CPU의 예측 실행([[Speculative Execution|Speculative Execution]]) 과정에서 발생하는 미세한 시간 차이를 측정하고, 결과적으로 같은 브라우저 프로세스 내에 로드된 다른 사이트의 비밀번호 등 **민감한 메모리 데이터를 탈취하는 스펙터(Spectre) 취약점**을 발견했습니다. 이 치명적인 보안 결함 때문에 브라우저 벤더들은 2018년경 이 기능을 일괄 비활성화했습니다.
**2. Cross-Origin Isolation (교차 출처 격리) 도입** 이후 브라우저들은 멀티스레딩의 성능적 이점을 포기할 수 없었기에, 현재 실행 중인 웹 페이지가 신뢰할 수 없는 외부의 다른 사이트(Origin) 리소스와 철저히 분리된 안전한 환경에서만 `SharedArrayBuffer`를 다시 사용할 수 있도록 정책을 변경했습니다. 이 격리된 환경을 **'Cross-Origin Isolated'** 상태라고 부릅니다.
**3. COOP 및 COEP HTTP 헤더 설정법** 웹 애플리케이션에서 `SharedArrayBuffer`를 활성화하려면, 서버 측(Nginx, Apache, Node.js Express, Vercel, AWS CloudFront 등)에서 HTML 문서를 응답할 때 반드시 다음 **두 가지 HTTP 보안 헤더**를 내려보내야 합니다.
- **`Cross-Origin-Opener-Policy: same-origin` (COOP):** 현재 문서와 다른 출처를 가진 팝업창이나 외부 문서가 서로의 `window` 객체에 접근하지 못하도록 브라우징 실행 컨텍스트를 분리합니다.
- **`Cross-Origin-Embedder-Policy: require-corp` (COEP):** 명시적으로 승인받지 않은 다른 출처의 리소스(외부 이미지, 스크립트, iframe 등)가 현재 페이지에 임베드되는 것을 원천적으로 차단합니다.
**4. 설정 시 발생할 수 있는 사이드 이펙트 및 주의사항** 위 헤더를 적용하여 고성능 환경을 얻는 대신, 보안 격리가 너무 엄격해져서 **기존에 잘 작동하던 외부 CDN 스크립트나 외부 이미지 등이 차단되는 문제**가 발생할 수 있습니다. 이를 해결하기 위해서는 외부 리소스를 제공하는 서버 측에서 `Cross-Origin-Resource-Policy: cross-origin` (CORP) 헤더나 적절한 CORS 설정(`Access-Control-Allow-Origin`)을 제공해야 하며, 클라이언트의 HTML 태그에도 `<img src="..." crossorigin="anonymous">`와 같이 명시적인 속성을 추가해 주어야 합니다.
---
**1. Cross-Origin Isolation(교차 출처 격리)의 필요성** `SharedArrayBuffer`는 스레드 간 원자적 연산과 메모리 공유를 지원하지만, 이를 악용하면 타이밍 공격(Spectre)을 통해 브라우저 내 다른 사이트의 민감한 데이터를 탈취할 수 있습니다. 브라우저 벤더들은 이를 막기 위해 현재 페이지가 신뢰할 수 없는 외부 출처(Origin) 리소스와 철저히 분리된 안전한 **'Cross-Origin Isolated'** 환경에서만 객체 생성을 허용하도록 보안 정책을 강화했습니다.
**2. 필수 HTTP 응답 헤더 설정 (COOP / COEP)** 이 격리 환경을 활성화하려면, HTML을 제공하는 웹 서버(Node.js Express, Nginx, Vercel 등)의 응답 헤더(Response Headers)에 다음 두 가지를 반드시 추가해야 합니다.
- **`Cross-Origin-Opener-Policy: same-origin` (COOP):** 현재 최상위 문서가 다른 교차 출처 문서(예: 타 사이트에서 열린 팝업창 등)와 브라우징 실행 컨텍스트를 공유하지 못하도록 차단하여 외부 간섭을 막습니다.
- **`Cross-Origin-Embedder-Policy: require-corp` (COEP):** (경우에 따라 `credentialless` 사용 가능) 명시적인 보안 승인(CORS 또는 CORP 헤더)을 받지 않은 외부 리소스(외부 CDN 스크립트, 이미지, iframe 등)가 현재 페이지에 임베드(Embed)되는 것을 원천적으로 차단합니다.
**3. 브라우저 활성화 검증** 서버 헤더가 올바르게 설정되어 페이지가 로드되면, 클라이언트의 자바스크립트 환경에서 전역 속성인 **`crossOriginIsolated``true`를 반환**합니다. 이 상태에서만 오류 없이 `new SharedArrayBuffer()`를 호출할 수 있습니다.
**4. 헤더 적용 시 발생하는 사이드 이펙트와 해결책** 이 보안 정책은 매우 엄격하여 **기존에 정상적으로 불러오던 외부 이미지나 서드파티 스크립트(Google Analytics 등)가 브라우저에 의해 렌더링 차단되는 심각한 부작용**이 발생할 수 있습니다. 이를 우회하고 해결하려면:
- HTML 내 모든 외부 리소스 태그(예: `<img>`, `<script>`)에 `crossorigin="anonymous"` 속성을 추가해야 합니다.
- 해당 외부 리소스를 제공하는 서버 측에서 `Access-Control-Allow-Origin` (CORS) 또는 `Cross-Origin-Resource-Policy: cross-origin` (CORP) 응답 헤더를 함께 내려주어야 합니다.
## ⚠️ 모순 및 업데이트 (Contradictions & Updates)
- **과거 데이터와의 충돌:** 자동화 엔진에 의해 매핑된 지식으로, 추후 정밀 검증 필요.
- **정책 변화:** General Knowledge 분야의 자동 자산화 수행.
---
- **과거 데이터와의 충돌:** 자동화 엔진에 의해 매핑된 지식으로, 추후 정밀 검증 필요.
- **정책 변화:** Programming & Language 분야의 자동 자산화 수행.
---
- **과거 데이터와의 충돌:** 자동화 엔진에 의해 매핑된 지식으로, 추후 정밀 검증 필요.
- **정책 변화:** Programming & Language 분야의 자동 자산화 수행.
## 🔗 지식 연결 (Graph)
- **Related Topics:** Spectre Vulnerability, HTTP Security Headers (COOP/COEP), CORS (Cross-Origin Resource Sharing), Web Worker Multi-threading
- **Projects/Contexts:** 보안이 강화된 멀티스레드 기반 React [[WebGL|WebGL]] 게임 엔진 구축
- **Contradictions/Notes:** 제공된 소스에 따르면 `SharedArrayBuffer`는 성능과 속도 면에서 가장 이상적이지만 로우 레벨(Low-level)의 원시 이진 데이터를 다루어야 해서 구현이 까다롭습니다. 여기에 더해 COOP/COEP 보안 헤더까지 설정해야 하므로 인프라 구축 및 외부 리소스 관리의 복잡성이 급격히 증가한다는 점을 프로젝트 기획 단계에서 반드시 고려해야 합니다.
---
_Last updated: 2026-04-14_
---
---
- **Related Topics:** Spectre & Meltdown 취약점, CORS (Cross-Origin Resource Sharing), HTTP Security Headers (COOP, COEP, CORP), Web Worker 멀티스레딩 통신
- **Projects/Contexts:** 보안 격리 환경에서의 고성능 웹 게임 개발, 멀티스레드 기반 렌더링 파이프라인(React Three Fiber)
- **Contradictions/Notes:** 로컬 개발 환경(`localhost` 또는 `127.0.0.1`)에서는 개발 편의상 Cross-Origin Isolation 헤더 없이도 `SharedArrayBuffer`가 임시로 동작할 수 있으나, 실제 프로덕션(HTTPS 환경)에 배포할 때는 반드시 헤더 설정이 필요합니다.
---
_Last updated: 2026-04-14_
---
---
- **Related Topics:** Spectre 부채널 공격 ([[Side-channel Attack|Side-channel Attack]]), HTTP Security Headers (COOP/COEP/CORP), CORS (Cross-Origin Resource Sharing), Web Worker Multi-threading
- **Projects/Contexts:** 보안이 강화된 고성능 [[WebGL|WebGL]]/React 게임 엔진 배포 환경 구축
- **Contradictions/Notes:** 로컬 개발 환경(`localhost` 또는 `127.0.0.1`)에서는 개발 편의를 위해 COOP/COEP 헤더 없이도 `SharedArrayBuffer`가 일시적으로 동작할 수 있습니다. 하지만 실제 도메인이 연결된 프로덕션(HTTPS) 환경으로 배포할 때는 서버 헤더 설정이 누락되면 즉시 앱이 중단되므로 인프라 수준에서의 꼼꼼한 설정이 필요합니다.
---
_Last updated: 2026-04-14_
---
## 🤖 LLM 활용 힌트 (How to Use This Knowledge)
**언제 이 지식을 쓰는가:**
- *(TODO)*
**언제 쓰면 안 되는가:**
- *(TODO)*
## 🧪 검증 상태 (Validation)
- **정보 상태:** needs_review
- **출처 신뢰도:** A
- **검토 이유:** *(P-Reinforce Phase 1 자동 정규화. 본문 검증 필요.)*
## 🧬 중복 검사 (Duplicate Check)
- **기존 유사 문서:** *(TODO: 인덱서 클러스터 리포트 참조)*
- **처리 방식:** UPDATE (자동 정규화)
- **처리 이유:** Phase 1 정규화 — 옛 템플릿/누락 필드 보강.
## 🕓 변경 이력 (Changelog)
| 날짜 | 변경 내용 | 처리 방식 | 신뢰도 |
|------|-----------|-----------|--------|
| 2026-05-08 | P-Reinforce Phase 1 정규화 (frontmatter + 헤더 표준화) | UPDATE | A |
## 💻 코드 패턴 (Code Patterns)
**패턴 1:** *(TODO: 이 프로젝트 컨벤션 반영한 구조 스켈레톤)*
```text
# TODO
### COOP+COEP server headers (Express)
```javascript
app.use((req, res, next) => {
res.setHeader('Cross-Origin-Opener-Policy', 'same-origin');
res.setHeader('Cross-Origin-Embedder-Policy', 'require-corp');
next();
});
```
## 🤔 의사결정 기준 (Decision Criteria)
### crossOriginIsolated check
```javascript
if (!self.crossOriginIsolated) {
console.error('SAB unavailable — page not isolated');
} else {
const sab = new SharedArrayBuffer(1024);
const view = new Int32Array(sab);
Atomics.store(view, 0, 42);
}
```
**선택 A를 써야 할 때:**
- *(TODO)*
### Worker shared state
```javascript
const sab = new SharedArrayBuffer(4);
const counter = new Int32Array(sab);
const worker = new Worker('worker.js');
worker.postMessage(sab);
Atomics.add(counter, 0, 1);
Atomics.notify(counter, 0);
```
**선택 B를 써야 할 때:**
- *(TODO)*
### CORP for static asset CDN
```nginx
location ~* \.(js|wasm|png)$ {
add_header Cross-Origin-Resource-Policy "cross-origin";
}
```
**기본값:**
> *(TODO)*
### credentialless COEP (2024+)
```javascript
res.setHeader('Cross-Origin-Embedder-Policy', 'credentialless');
// cross-origin no-cors fetch without credentials — no CORP required
```
## ❌ 안티패턴 (Anti-Patterns)
### iframe with allow attribute
```html
<iframe src="https://embed.example.com"
allow="cross-origin-isolated"></iframe>
```
- **[안티패턴]:** *(TODO: 무엇을 하면 안 되는가 + 이유 + 대신 무엇을)*
### Wasm threads init
```javascript
import init from './pkg/app.js';
await init(); // requires crossOriginIsolated for SAB-based threads
```
## 매 결정 기준
| 상황 | Approach |
|---|---|
| New app + threading needed | COOP same-origin + COEP require-corp |
| Legacy 3rd-party embeds | COEP credentialless (2024+) |
| Static asset CDN | CORP cross-origin header on all assets |
| No SAB needed | Skip isolation — broader compat |
**기본값**: `COOP same-origin` + `COEP require-corp` for threaded Wasm; credentialless if 3rd-party embeds.
## 🔗 Graph
- 부모: [[Browser-Security-Model]] · [[Same-Origin-Policy]]
- 변형: [[Spectre-Mitigation]] · [[Site-Isolation]]
- 응용: [[WebAssembly-Threads]] · [[Web-Workers]] · [[Atomics-API]]
- Adjacent: [[CORS]] · [[CSP]] · [[Subresource-Integrity]]
## 🤖 LLM 활용
**언제**: SAB 의 use-case (Wasm threads, multi-thread JS) 의 enable 필요.
**언제 X**: simple SPA — overhead 의 worth 가 X.
## ❌ 안티패턴
- **CORP omission on CDN**: 매 silently break embedded resources.
- **COOP without COEP**: 매 SAB still blocked.
- **Naive credentialless adoption**: 매 cookie-based 3rd-party widgets break.
## 🧪 검증 / 중복
- Verified (web.dev coop-coep, MDN SharedArrayBuffer, Chrome blog).
- 신뢰도 A.
## 🕓 Changelog
| 날짜 | 변경 |
|---|---|
| 2026-05-08 | Phase 1 |
| 2026-05-10 | Manual cleanup — SAB security, COOP/COEP/CORP triad, Wasm threads enabling |