v-html 바인딩은 연결된 속성을 순수 HTML로 렌더링합니다. 편리할 수는 있지만 믿을 수 있는 값일 때만 사용하거나 거의 사용하지 않는 편이 좋습니다. 이제는 성가신 가격 값 표시를 고쳐 봅시다.
Note 크로스 사이트 스크립트 공격
뷰에 직접적으로 HTML을 삽입하는 코드를 작성할 때 애플리케이션은 크로스 사이트 스크립트 공격(XSS)에 노출됩니다.
높은 수준에서는 어설픈 사람이 웹 사이트를 방문해서 잘 처리되지 않은 양식을 사용하여 데이터베이스에 악성 자바스크립트를 저장하면, HTML로 해당 코드를 출력할 때 굉장히 취약해집니다.
일반적으로 가장 좋은 방법은 HTML과 콘텐츠에 대한 기본 원칙을 최소한으로 따르는 것입니다.
• HTML 보간을 사용할 때는 신뢰할 수 있는 콘텐츠만 출력합니다.
• 아무리 콘텐츠를 잘 검사했더라도 HTML 보간을 사용할 때는 절대 사용자가 제공한 콘텐츠를 출력하지 않습니다.
• 정말로 필요하다면 텍스트 입력으로 HTML 요소를 받지 않고 고유의 템플릿 컴포넌트를 사용해서 기능을 구현합니다.
XSS의 포괄적이고 명확한 개요를 원한다면 https://excess-xss.com/의 글로 시작하면 됩니다. 각 취약점 공격에 대한 샘플 코드를 살펴보거나 더 깊게 이해하고 싶다면 https://www.owasp.org/index.php/Cross-site_Scripting_(XSS)의 OWASP 위키를 참고하세요.