2. CSRF

(1) CSRF의 구조

1) 이해

2) 공격 시나리오 예시

이메일을 통한 개인정보 변경 시나리오

1. 피해자가 웹 사이트에 로그인하면 인증 정보(세션 ID, 토큰 등)가 브라우저 저장소에 저장됨

2. 공격자는 피해자의 브라우저 인증 정보를 이용해 사이트 개인정보를 변경하는 악성 스크립트를 만듦

3. 공격자는 위 스크립트를 웹 페이지나 프로그램으로 제작하고, 피해자에게 웹 페이지 링크나 프로그램 첨부파일이 포함된 이메일을 발송함

4. 피해자가 CSRF 취약점이 있는 웹 사이트에 로그인한 상태로 공격자의 이메일을 열어 봄. 그리고 그 안의 링크를 클릭하거나 첨부파일을 다운로드 받아 실행함

5. 피해자의 브라우저가 자동으로 악성 스크립트를 실행해, 피해자 모르게 서버로 요청을 전송함

6. 서버는 요청에 포함된 인증 정보를 확인하여 요청자를 짐작하고, 요청을 정상적으로 처리함

7. 결국 사이트 내 피해자의 개인정보는 공격자가 의도한 대로 변경됨

3) XSS와 비교

(2) 대책 방법

1) CSRF 토큰(동기화 토큰) 패턴

<form action="/" method="POST">
	<input
		type="hidden"
		name="CSRF_TOKEN" 
		value="SEcretTOken%1234&5678*90"
	/>
	<!-- 다른 form 요소들... -->
</form>

2) Double Submit 쿠키 패턴

3) SameSite 쿠키 속성 사용

/* 서버 측 코드 */
const express = require('express');
const session = require('express-session'); // express 앱의 세션 관리용 라이브러리
const app = express(); // 서버 앱 생성

app.use(session({ // 세션 미들웨어 설정
  cookie: {
    sameSite: 'strict', // sameSite 속성 설정
    secure: true // HTTPS 사용
  }
}));

4) Origin 헤더 검사

/* 서버 측 코드 */
const express = require('express');
const app = express(); // 서버 앱 생성

app.use((req, res, next) => { // 출처 검증 미들웨어 설정
  const allowedOrigins = ['https://example1.com', 'https://example2.com']; // 신뢰할 수 있는 출처 목록
  const origin = req.headers.origin;

  if (allowedOrigins.includes(origin)) {
    next();
  } else {
    res.status(403).json({ error: 'Forbidden - Invalid Origin' });
  }
});