web-dev-qa-db-ja.com

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

JavaScriptで書かれたシンプルなHTMLサニタイザーを探しています。 100%XSSで安全である必要はありません。

私は自分のWebサイトにMarkdownとWMD Markdownエディター(githubのSO masterブランチ)を実装しています。問題は、ライブプレビューに表示されるHTMLがこのようにフィルター処理されないことです。プレビューウィンドウのコンテンツをフィルタリングできるように、JavaScriptで記述されたシンプル/クイックHTMLサニタイザーを探しています。

完全なXSS保護を備えた完全なパーサーは不要です。出力をサーバーに送り返しません。結果をデータベースに保存する前に、適切な完全なHTMLサニタイザーを使用するサーバーにMarkdownを送信しています。

Googleは絶対に役に立たない。私は、あらゆる種類のサーバーサイド言語でユーザーが生成したHTMLからJavaScriptを除外する方法に関する何百もの(多くの場合間違った)記事を受け取りました。

[〜#〜] update [〜#〜]

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

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

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

MarkDownコンバーターはHTMLなので、それには触れません。 HTMLサニタイザーは、スクリプト要素がなくなるようにストリップします。

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

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

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

手伝ってくれますか?前もって感謝します!

27
Sander Marechal

この質問で推奨されるものをご覧ください Sanitize/Rewrite HTML on the Client Side

また、XSSについてこれ以上行う必要がないことを確認するために、この1つに対する回答を確認してください ユーザー生成HTML 内のJavascriptインジェクション攻撃を防ぐ方法

13
Michael Dillon

単純なHtmlSantizerを開発し、ここでオープンソース化しました: https://github.com/jitbit/HtmlSanitizer

使用法

var result = HtmlSanitizer.SanitizeHtml(input);

[免責事項!私は著者の一人です!]

3
Alex