본문 바로가기
React

28. 보안 - 1

by leo2114 2024. 2. 20.
반응형

XSS(Cross Site Scripting) 방어

XSS(Cross Site Scripting)는 웹 애플리케이션에서 발생하는 보안 취약점 중 하나로, 악의적인 사용자가 스크립트를 삽입하여 사용자의 정보를 탈취하거나 악의적인 행동을 할 수 있습니다. 이번 글에서는 XSS 공격을 방어하는 방법에 대해 알아보겠습니다.

XSS 공격 종류

  1. Reflected XSS: 사용자가 입력한 데이터가 서버에서 동적으로 생성된 페이지에 반영되어 공격을 실행합니다.
  2. Stored XSS: 공격자가 악성 스크립트를 데이터베이스에 저장하고, 다른 사용자가 해당 데이터를 조회할 때 공격이 실행됩니다.
  3. DOM-based XSS: 클라이언트 측에서 발생하며, 브라우저의 DOM(Document Object Model)을 조작하여 공격을 실행합니다.

XSS 방어 방법

입력 값 검증: 사용자로부터 받은 입력 값에 대해 필터링하여 허용되지 않은 문자나 스크립트를 제거합니다.

const sanitizedInput = input.replace(/<script.*?>|<\/script.*?>/g, '');

 

출력 값 이스케이프: 사용자 입력 값을 출력할 때는 반드시 이스케이프하여 HTML 태그로 해석되지 않도록 합니다.

const escapedInput = escape(input);

 

콘텐츠 타입 설정: 브라우저에게 웹 페이지의 콘텐츠 타입을 명시하여 스크립트 실행을 방지합니다.

<meta http-equiv="Content-Security-Policy" content="script-src 'self'">

 

쿠키의 HttpOnly 속성 사용: XSS 공격으로부터 쿠키를 보호하기 위해 쿠키에 HttpOnly 속성을 설정하여 JavaScript에서 접근할 수 없도록 합니다.

Set-Cookie: sessionid=abc123; HttpOnly

결론

XSS 공격은 웹 애플리케이션의 보안에 중대한 위협을 가할 수 있습니다. 따라서 적절한 보안 대책을 마련하여 사용자 데이터를 안전하게 처리해야 합니다. 입력 값 검증, 출력 값 이스케이프, 콘텐츠 타입 설정, HttpOnly 속성 사용 등의 방법을 적용하여 XSS 공격으로부터 웹 애플리케이션을 보호할 수 있습니다.

반응형

'React' 카테고리의 다른 글

32. React 생태계와 주요 라이브러리 - 1  (0) 2024.02.20
31. 배포 - 2  (0) 2024.02.20
30. 배포 - 1  (0) 2024.02.20
29. 보안 - 2  (0) 2024.02.20
27. 서버 사이드 렌더링(SSR) - 2  (0) 2024.02.20
26. 서버 사이드 렌더링(SSR) - 1  (0) 2024.02.20
25. 테스팅 - 2  (0) 2024.02.20
24. 테스팅 - 1  (0) 2024.02.20