java - :)などのテキストのスマイリーを画像に置き換える方法は？

Question

JSF /PrimeFacesWebアプリケーションでスマイリーを画像として表示したいと思います。このためには、テキスト:)を画像のように置き換える必要があります。どうすればこれを達成できますか？

Answer 1

JSF は、このための機能を提供していません。

最も単純な方法として、クラスの使用可能なメソッドをStringString使用して、インスタンスに対して操作を実行できます ( replace().

text = text.replace(":)", "<img src=\"smile.png\" />");

( 「... セミコロン ; (またはコロン、:) ...」などの正当な文字シーケンスが誤って置き換えられるのを防ぐために、おそらく正規表現またはレクサーを使用して、よりきめ細かいマッチングを適用することをお勧めします)

次に、HTML 画像を含む操作されたインスタンスを JSF で表示するには、XSS 攻撃の穴を防ぐために使用されている組み込みの HTML エスケープを無効にする属性セットを使用するString必要があります。<h:outputText>escapefalse

<h:outputText value="#{bean.text}" escape="false" />

このように、HTML<img>要素は、エスケープのためにエンドユーザーにプレーンテキストで表示されるのではなく、Web ブラウザーによって文字どおりに解釈されます。

しかし、すでにお察しのとおり、エンドユーザーの入力を事前にサニタイズしないと、XSS 攻撃の穴が開いてしまう可能性があります。エンドユーザーは、テキストにa を追加するなど、入力で悪いことを行うことができ<script>stealCookies()</script>ます。これは、Web ブラウザーによっても文字通り解釈されます。エンドユーザーの入力を事前にサニタイズするには、この方法を提供するJsoupを使用できます。clean()

text = Jsoup.clean(text, Whitelist.basic());

(スマイリーを置き換える前にこれを行ってください。そうしないと、それらの<img>タグも削除される可能性があります!)