XSS·인젝션 방어를 클라이언트 레벨에서 직접 구현한 경험
은행 서비스처럼 민감한 정보를 다루는 서비스에서 프론트엔드 개발자가 가장 먼저 신경 써야 하는 것은 사용자 입력이 그대로 화면에 렌더링되지 않도록 하는 것이라고 생각합니다. 입력값을 그대로 믿어서는 안 됩니다.
개인 프로젝트에서 게시판 기능을 만들다가 스크립트가 포함된 입력값이 그대로 렌더링되는 문제를 실제로 경험했습니다. 직접 만든 버그였는데, innerHTML 대신 textContent를 사용하는 것만으로 해결되었습니다. 이후 라이브러리 없이 출력 인코딩을 수동으로 처리하는 방식과 DOMPurify 같은 라이브러리를 사용하는 방식을 비교해보았고, 금융 서비스에서는 라이브러리를 사용하되 허용 태그 목록을 엄격히 관리해야 한다는 것을 배웠습니다. 실패는 보안 이슈를 다 해결했다고 생각했는데 form 전송 경로에서 같은 문제가 또 발생한 것이었습니다.
보안은 한 곳을 막았다고 끝나는 것이 아니라, 데이터가 흐르는 모든 경로에서 확인하는 것이 중요합니다.