핵심 답변
📌 CSP(Content Security Policy)는 웹 페이지에서 로드할 수 있는 리소스의 출처를 제한하는 HTTP 응답 헤더입니다. 주로 XSS(Cross-Site Scripting) 공격을 방지합니다.
Content-Security-Policy 헤더에 허용할 출처를 명시합니다.
예시
javascript
Content-Security-Policy: default-src 'self'; script-src 'self' https://cdn.example.com;
typescript
// Next.js에서 설정 (next.config.ts)
async headers() {
return [{
source: '/(.*)',
headers: [{
key: 'Content-Security-Policy',
value: "default-src 'self'; script-src 'self' 'unsafe-eval';",
}],
}];
}핵심 용어
📌 XSS(Cross-Site Scripting)공격자가 웹 페이지에 악성 스크립트를 삽입하는 공격입니다. CSP는 허용되지 않은 스크립트 실행을 차단해 이를 방어합니다.
📌 default-src 'self'기본 정책으로 같은 출처의 리소스만 허용합니다. 별도로 지정되지 않은 리소스 유형에 이 정책이 적용됩니다.