JavaScript의 간단한 HTML 소독제

StackOverflow https://stackoverflow.com/questions/1637275

문제

JavaScript로 작성된 간단한 HTML 소독제를 찾고 있습니다. 100% XSS 안전 일 필요는 없습니다.

내 웹 사이트에서 Markdown과 Wmd Markdown 편집기 (Github의 So Master Branch)를 구현하고 있습니다. 문제는 라이브 미리보기에 표시된 HTML이 필터링되지 않았다는 것입니다. 미리보기 창의 내용을 필터링 할 수 있도록 JavaScript로 작성된 간단한/빠른 HTML 소독제를 찾고 있습니다.

완전한 XSS 보호 기능을 갖춘 전체 파서가 필요하지 않습니다. 출력을 서버로 다시 보내지 않습니다. 데이터베이스에 결과를 저장하기 전에 적절하고 완전한 HTML 소독제를 사용하는 서버로 마크 다운을 보내고 있습니다.

구글은 나에게 절대적으로 쓸모가 없다. 모든 종류의 서버 측 언어로 사용자 생성 HTML에서 JavaScript를 필터링하는 방법에 대한 수백 개의 (종종 잘못된) 기사를 얻습니다.

업데이트

나는 이것에 왜 이것을 필요로하는지 조금 더 잘 설명하겠습니다. 내 웹 사이트에는 StackoverFlow의 웹 사이트와 매우 유사한 편집기가 있습니다. 마크 다운 구문을 입력 할 텍스트 영역과 그 아래에 미리보기 창이 제출 된 후 어떻게 보이는지 보여줍니다.

사용자가 무언가를 제출하면 마크 다운 형식으로 서버로 전송됩니다. 서버는 HTML로 변환 한 다음 HTML 소독제를 실행하여 HTML을 정리합니다. Markdown은 임의의 HTML을 허용하므로 정리해야합니다. 예를 들어, 사용자는 다음과 같은 것을 입력합니다.

<script>alert('Boo!');</script>

Markdown 변환기는 HTML이므로 터치하지 않습니다. HTML 소독제는 스크립트 요소가 사라지도록 제거합니다.

그러나 이것은 미리보기 창에서 일어나는 일이 아닙니다. 미리보기 창은 Markdown을 HTML로만 변환하지만 소독되지 않습니다. 따라서 미리보기 창에는 스크립트 요소가 있습니다. 즉, 미리보기 창이 서버의 실제 렌더링과 다릅니다.

나는 이것을 고치고 싶기 때문에 빠르고 더 큰 JavaScript HTML 소독제가 필요합니다. 기본 요소/속성 블랙리스트 및 화이트리스트로 간단한 일이 가능합니다. XSS 보호가 서버 측 HTML 소독제에 의해 수행되므로 XSS 안전 일 필요는 없습니다.

이것은 미리보기 창이 실제 렌더링 99.99%와 일치하는지 확인하기위한 것입니다. 이는 나에게 충분합니다.

도울 수 있니? 미리 감사드립니다!

도움이 되었습니까?

해결책

이 질문에서 추천 한 것을 살펴 봐야합니다. 클라이언트 측에서 HTML을 소독/다시 작성하십시오

그리고 XSS에 대해 더 많은 것을 할 필요가 없는지 확인하려면이 답변을 검토하십시오. 사용자가 생성 한 HTML 내에서 JavaScript 주입 공격을 방지하는 방법

다른 팁

우리는 간단한 htmlsantizer를 개발하고 여기에서 오프 싱 소환했습니다. https://github.com/jitbit/htmlsanitizer

용법

var result = HtmlSanitizer.SanitizeHtml(input);

부인 성명! 나는 저자 중 하나입니다!

내 기능의 경우 문자열이 비어 있지 않으며 영숫자 만 포함되어 있다고 생각했습니다. 이것은 일반 JS와 세 번째 라이브러리를 사용하지 않습니다. 그것은 긴 정규식이 포함되어 있지만, 그것은 작업을 수행 할 수 있지만, 당신은 이것을 구축 할 수 있지만, 당신의 regex는 더 같은 무언가 '<cript> | < /script>'(필요한 경우 캐릭터가 탈출하여 공백을 뺀 것입니다). ;)

    var validateString = function(string) {

      var validity = true;

      if( string == '' ) { validity = false; }

      if( string.match( /[ |<|,|>|\.|\?|\/|:|;|"|'|{|\[|}|\]|\||\\|~|`|!|@|#|\$|%|\^|&|\*|\(|\)|_|\-|\+|=]+/ ) != null ) {

          validity = false;
      }

      return validity;
    }
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top