이렇게 사용하세요
리소스 출처별 Content-Security-Policy를 조립합니다.
알아두면 좋은 점
형식과 의미
각 입력에 공백으로 구분한 출처를 넣습니다. 실제 페이지에서 Report-Only로 먼저 확인하세요.
지원 범위와 제한
텍스트 1MB
입력이 제한을 넘으면 데이터를 나누어 처리하세요. 파일 형식이나 알고리즘이 지원 범위에 없으면 다른 형식으로 임의 변환하지 말고 요구 사항에 맞는 도구를 선택하세요.
CSP 생성기
리소스 출처별 Content-Security-Policy를 조립합니다.
입력은 이 브라우저에서 처리됩니다.
결과
입력 후 실행하면 결과가 표시됩니다.
사용 예제 코드
개발에 가져다 쓸 수 있는 기본 예제입니다. 표시된 환경에서 실행하세요.
Node.js 22+ · ES module (.mjs)
현재 입력 반영은 코드에 사용된 항목에만 적용됩니다. 파일 입력은 예제에 포함하지 않습니다.
필요한 패키지 설치
const directives = {
"default-src": ["'self'"],
"script-src": ["'self'", "https://cdn.example.com"],
"object-src": ["'none'"],
"base-uri": ["'self'"],
"frame-ancestors": ["'none'"],
};
const policy = Object.entries(directives)
.map(([name, values]) => name + " " + values.join(" "))
.join("; ");
console.log("Content-Security-Policy: " + policy);