JavaScriptのシンプルなHTMLサニタイザ

Question

JavaScriptで書かれた単純なHTMLサニタイザを探しています。 XSSを100％安全にする必要はありません。

私はMarkdownとWMD Markdownエディタ（githubのSOマスターブランチ）を自分のウェブサイトで実装しています。問題は、ライブプレビューに表示されるHTMLがフィルタリングされていないことです。 JavaScriptで書かれたシンプルで素早いHTMLサニタイザーを探していますので、プレビューウィンドウの内容をフィルタリングすることができます。

完全なXSS保護機能を備えた完全なパーサーは必要ありません。出力をサーバーに戻すわけではありません。私はMarkdownをサーバーに送信します。ここでは、結果をデータベースに格納する前に、適切な完全なHTMLサニタイザを使用します。

Googleは私には絶対に役に立たない。私は、あらゆる種類のサーバー側言語でユーザーが生成したHTMLからJavaScriptを除外する方法について、何百もの記事（たいていは間違っている記事）を取得しています。

UPDATE

私はこれを必要とする理由私は少し良く説明します。私のウェブサイトには、StackOverflowのエディタと非常に似たエディタがあります。 MarkDownの構文を入力するためのテキスト領域と、その下にプレビューウィンドウがあり、それを送信した後の様子が示されています。

ユーザーが何かを送信すると、MarkDown形式でサーバーに送信されます。サーバーはHTMLをHTMLに変換し、HTMLサニタイザを実行してHTMLをクリーンアップします。 MarkDownは任意のHTMLを許可するので、私はそれをきれいにする必要があります。たとえば、ユーザーは次のように入力します。

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

MarkDownコンバータはHTMLであるため、これに触れません。 HTMLサニタイザはそれを取り除き、スクリプト要素がなくなるようにします。

しかし、これはプレビューウィンドウでは起こりません。プレビューウィンドウはMarkDownをHTMLに変換するだけですが、それをサニタイズしません。したがって、プレビューウィンドウにはスクリプト要素があります。これは、プレビューウィンドウがサーバー上の実際のレンダリングと異なることを意味します。

私はこれを修正したいので、すばやくかわいいJavaScriptのHTMLサニタイザが必要です。基本的な要素/属性のブラックリストとホワイトリストに単純なものがあります。 XSSの保護はサーバー側のHTMLサニタイザによって行われるため、XSSに対して安全である必要はありません。

これは、プレビューウィンドウが99.99％の実際のレンダリングと一致することを確認するためのもので、これで十分です。

お手伝いできますか？前もって感謝します！

Answer 1

あなたはこの質問Sanitize/Rewrite HTML on the Client Side

に推奨を見ることもできます。そして、ちょうどあなたがXSSについての詳細を行う必要がないことを確認するために、この1 How to prevent Javascript injection attacks within user-generated HTML

Answer 2

への回答を確認してください必要があります私の機能のために、私は文字列が空ではなく、英数字のみを含んでいることを気にしていました。これはプレーンなJSを使用し、3番目のライブラリなどは使用しません。それは長い正規表現が含まれていますが、それは仕事です;） これで構築することができますが、あなたの正規表現をもっと似ていることがあります '<スクリプト> | </script> '（必要に応じて文字をエスケープし、スペースを除いて）。;）

var validateString = function(string) { 

     var validity = true; 

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

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

      validity = false; 
     } 

     return validity; 
    }