nobu blog

C#プログラミングやゲーム、ゲーム音楽コンサート周りの話をつらつらと。

*



ASP.NET MVCでテキストエディタを使う その4 サーバサイド編

   

はじめに

前回までにcontenteditable属性を用いたテキストエディタを出力できるHTMLヘルパーの作成方法を紹介しました。
今回は実際にそれに合わせたサーバーサイドの実装を説明します。

データクラス定義

まずは、以下のようなNewsクラスを利用することを前提で話を進めます。

このNewsクラスのDetailプロパティをテキストエディタとして利用可能にするためにAllowHtml属性を付与します。
この属性を付与しないとASP.NET MVCのフレームワークレベルで不正なタグや文字列をチェックする処理が実行されてエラーとなっていします。

エスケープ処理

上記のAllowHtml属性を付与したことで様々なタグが許可されてしまうため、Javascriptの埋め込みなども可能になってしまいます。そのため、不正なタグなどをエスケープする処理が必要となります。
入力内容をエスケープする手段は色々あると思いますが、今回はNSoupといったオープンソースを利用します。元はjsoupといったJava向けのライブラリを.NET向けに移植したもののようです。
Nugetなどには対応していなさそうなので手動でダウンロードして参照に加えます。
そしてNSoupを利用した以下のようなHTML変換クラスを作成します。

Whitelistを用意して許可するタグを定義します。自前ですべて作ることも可能ですが、今回は初めから用意されたRelaxedを使用して、そこに許可する属性を追加します。
Relaxed以外にも組み込みの定義が何個か用意されていますので、どのようなタグが許容されるのかは本家のjsoupのところを見ればわかると思います。

<リンク>

上記のクラスを利用して無効なHTMLが入力された場合にカットするようにしてみましょう。

あとは以下のようにコントローラのアクションメソッド内でEscapeHtmlメソッドを呼び出しを行えば完了です。

まとめ

4回に分けてフォントサイズなどの指定が可能なテキストエディタの作成を取り上げてきました。
まだまだ未完成な部分もありますので色々手を加えてみてください。

その1
その2
その3

 - ASP.NET MVC, C#, HTML