### XSS 공격의 예시
일반적인 XSS 공격은 서버와의 통신을 통해 사용자의 정보를 탈취하는 방식으로 이루어집니다. 예를 들어, 아래와 같은 간단한 댓글 시스템이 있을 때, XSS 공격이 발생할 수 있습니다.
```html
<!-- 악성 스크립트가 삽입될 수 있는 댓글 폼 -->
<form method="POST" action="/submit-comment">
<textarea name="comment"></textarea>
<button type="submit">Submit</button>
</form>
<!-- 서버에서 댓글을 받아와 출력하는 부분 -->
<div>
<!-- 사용자 입력을 필터링 없이 그대로 출력 -->
<%= comment %>
</div>
```
공격자는 `<script>` 태그를 통해 악성 코드를 삽입할 수 있으며, 다음과 같은 스크립트가 있을 수 있습니다.
```html
<script>alert('XSS 공격!');</script>
```
서버는 이 스크립트를 아무런 필터링 없이 사용자에게 전달하게 됩니다. 이는 사용자에게 의도치 않은 알림을 띄우거나, 쿠키 정보를 탈취하는 등의 추가 공격을 가능하게 합니다.
### XSS 방어 예시
XSS 공격을 방어하기 위해서는 상당한 주의가 필요합니다. 가장 기본적인 방어 방법은 사용자 입력의 유효성 검사를 철저히 수행하는 것입니다. 다음은 이를 수행하기 위한 몇 가지 방법입니다.
1. **입력 검증 및 인코딩**: 서버에서 사용자 입력을 받아들이기 전 필터링 과정을 거칩니다.
```javascript
function sanitizeInput(input) {
const element = document.createElement('div');
element.innerText = input;
return element.innerHTML;
}
```
위의 JavaScript 코드는 사용자가 입력한 텍스트를 HTML 요소의 텍스트로 설정하여, HTML 태그가 실행되지 않도록 안전하게 인코딩합니다.
2. **컨텍스트에 따른 인코딩**: 사용자 입력이 출력될 위치에 따라 HTML, JavaScript, URL 등의 인코딩을 다르게 적용합니다. 예를 들어, HTML 컨텍스트에서는 `&`, `<`, `>` 등의 문자를 HTML 엔티티로 변환합니다.
3. **Content Security Policy(CSP) 설정**: 웹 애플리케이션의 보안을 강화하기 위해 서버 응답 헤더에 CSP를 설정하여 특정 스크립트가 실행되는 것을 차단할 수 있습니다.
```http
Content-Security-Policy: default-src 'self'; script-src 'self' https://apis.google.com
Google for Developers - AI와 클라우드부터 모바일과 웹까지
개발자 리소스, 커뮤니티 이벤트, 영감을 주는 스토리를 탐색하여 더 스마트하게 개발하고 더 빠르게 출시하세요.
developers.google.com
```
위와 같은 CSP 설정은 동일 출처에서 로드된 스크립트 혹은 `https://apis.google.com`에서 제공하는 스크립트만 실행할 수 있도록 제한합니다.
### 결론
XSS는 가장 흔히 발생하는 보안 취약점 중 하나이지만, 올바른 보안 조치를 통해 예방할 수 있습니다. 사용자 입력에 대한 철저한 검증과 적절한 인코딩 방법, 그리고 Content Security Policy 설정 등을 활용하여 웹 애플리케이션을 보다 안전하게 보호할 수 있습니다. 이를 통해 사용자 데이터 및 애플리케이션의 신뢰성을 유지할 수 있습니다.