그알것 — 그럼에도 알아야 할 것들
홈질문커뮤니티
로그인
그알것 — 그럼에도 알아야 할 것들

Service

  • 홈
  • 소개
  • 질문
  • 커뮤니티

My

  • 내 워크스페이스
  • 저장한 질문
  • 작성한 답변

Policy

  • 이용약관
  • 개인정보처리방침
  • 문의

© 2026 그알것 · What Still Matters

질문 목록Security
Security

XSS 공격이란 무엇이며 프론트엔드에서 어떻게 방어하나요?

실무5/5
설계4/5
인간4/5
기초3/5

면접관의 질문 의도

"이스케이프하면 됩니다" 수준에서 멈추는지, 아니면 출력 컨텍스트별 인코딩과 CSP/sanitizer/쿠키 속성을 계층 방어로 엮어 설명하는지를 가른다. 프레임워크가 막아주는 범위와 그래도 남는 구멍을 구분하는지를 본다.

큐레이션 답변

학습 자료

XSS는 신뢰된 도메인의 페이지에 끼어든 스크립트가 사용자 브라우저에서 실행되는 공격이고, 서버에 저장돼 다시 내려오는 Stored, URL/요청 파라미터가 그대로 박히는 Reflected, 클라이언트 JS가 위험한 싱크에 값을 넣는 DOM 기반으로 갈린다. 방어의 핵심은 "데이터를 어떤 컨텍스트에서 출력하는가"에 맞춰 인코딩하는 것이다. HTML 본문이면 이스케이프, 속성·URL·JS 컨텍스트면 각자 다른 규칙으로 막고, DOM 조작은 innerHTML 대신 textContent를 기본으로 둔다. CSP·HttpOnly는 1차 방어가 뚫렸을 때 피해를 좁히는 안전망이지 입력 검증을 대체하지 않는다.

좋은 답변 구조

  1. 01Stored/Reflected/DOM 세 유형을 데이터가 어디서 들어와 어디서 실행되는지로 구분한다
  2. 021차 방어로 출력 컨텍스트별 인코딩과 안전한 DOM API 사용 원칙을 제시한다
  3. 03HTML 렌더링이 필요한 자리에서 sanitizer 화이트리스트와 dangerouslySetInnerHTML 정책을 설명한다
  4. 04CSP·HttpOnly·SameSite를 "뚫렸을 때 피해를 좁히는" 안전망으로 자리 잡고 마무리한다

자주 실수하는 포인트

React/Vue가 자동 이스케이프해주니 XSS는 끝났다고 단정하고 dangerouslySetInnerHTML·v-html·href=javascript: 같은 우회 경로를 빠뜨린다
HTML 본문 이스케이프만 알고 속성·URL·JS 컨텍스트마다 인코딩 규칙이 다르다는 점을 설명하지 못한다
CSP를 unsafe-inline 켠 채로 적용해놓고 "CSP가 있으니 안전하다"고 답한다
sanitizer를 붙였다는 사실만 말하고 허용 태그/속성 정책을 누가 어떻게 관리하는지 답하지 못한다

실무 맥락

  • 사용자 닉네임·댓글·게시글 본문이 다른 사용자의 화면에 그대로 렌더링되는 SNS형 서비스
  • 마크다운/리치텍스트 에디터로 HTML 일부를 허용해야 하는 블로그·문서 협업 도구
  • 외부 광고 스크립트·결제 위젯·임베드 SDK를 다수 붙이는 커머스 프론트
  • 쿼리스트링·해시 값을 그대로 DOM에 그려 넣는 SPA 라우팅 환경

본인 경험에 녹이는 힌트

dangerouslySetInnerHTML이나 v-html을 어쩔 수 없이 써야 했던 화면에서 sanitizer 정책을 어떻게 좁혔는지 풀어낼 수 있다

CSP를 Report-Only로 띄워 위반 로그를 보면서 인라인 스크립트·외부 도메인을 단계적으로 끊은 과정이 있다면 그대로 답변이 된다

사용자 입력을 받는 화면을 리뷰하면서 출력 컨텍스트별로 인코딩 위치를 옮긴 PR이 있으면 "왜 그 자리였는지"로 연결한다

외부 위젯/광고가 깨지는 걸 감수하고 CSP를 좁혔거나, 반대로 비즈니스 요구 때문에 정책을 푼 경험이 있다면 트레이드오프 사례로 쓸 수 있다

커뮤니티 인기 답변

전체 0개

아직 공개된 답변이 없어요. 첫 공개 답변을 남겨보세요.

관련 꼬리 질문

Q1CSP에서 nonce와 hash 기반 정책은 운영상 어떤 차이가 있고 어떤 환경에 각각 맞다고 보나요
Q2React에서 dangerouslySetInnerHTML을 써야 하는 자리에서 sanitizer 정책을 어떻게 설계하시겠어요
Q3HttpOnly 쿠키만으로 막을 수 없는 XSS 피해는 어떤 것들이 있을까요
Q4Trusted Types는 기존 CSP·sanitizer 조합과 어떻게 역할이 갈리나요
아직 답을 쓰지 않았어요.
큐레이션 답변과 다른 사람 답변을 보고, 자기 언어로 답을 정리해보면 학습 효과가 가장 큽니다.
목차
  • 01면접관의 질문 의도
  • 02큐레이션 답변
  • 03좋은 답변 구조
  • 04자주 실수하는 포인트
  • 05실무 맥락
  • 06본인 경험에 녹이는 힌트
  • 07커뮤니티 인기 답변준비중
  • 08관련 꼬리 질문