ASP.NET MVC 3 Razor における HTML エンコードと Html.Raw メソッドの利用

新年、あけましておめでとうございます。

今年も ASP.NET を中心としたマイクロソフトの Web テクノロジーの情報を、いろいろとみなさまにお伝えしていきたいと思いますので、何卒よろしくお願いいたします。

さて、新年早々ですが、ASP.NET MVC 3 と Razor ビューにおける HTML 文字列の表示について、簡単ですがご紹介したいと思います。

ビューに文字列を出力する際には、XSS (クロス サイト スクリプティング) 対策のために、文字列に HTML エンコード処理をおこなうことが大切です。ASP.NET 4 の Web フォームや ASP.NET MVC 2 では aspx の記述でコード ナゲット ( <% ...%> ) と共に コロン ( : ) を用いることで、簡単に文字列に対して HTML エンコードをおこなうことができます。

★ aspx における HTML エンコード

 <%: SomeHtmlString %>

また、ASP.NET MVC では HTML ヘルパーに HTML エンコードをおこなうためのメソッドも用意されています。

★ HTML ヘルパー メソッド

 <%= Html.Encode(SomeHtmlString) %>

とても簡単に文字列の HTML エンコード処理がおこなえるようになっていますが、これでもコーディング ミスなどで HTML タグなどを含んだ文字列がそのまま出力されてしまう恐れがあります。

そこで、ASP.NET MVC 3 や WebMatrix で使用できる、Razor 構文による新しいビュー エンジン (ASP.NET Web Pages) では、デフォルトで全ての文字列が必ず HTML エンコードされるようになっています。これにより、”HTML エンコード 忘れ” を防ぐことができます。

★ ASP.NET MVC 3 w/Razor (.cshtml)

 @{
    var htmlString = "<h1>Razor いいね！</h1>";
}

<div>@htmlString</div>

実行結果

HTML ソース

　

ただ、例えば HTML エディタなどを Web アプリケーションで実装する場合など、状況によっては HTML タグを含んだ文字列を HTML エンコードさせずにそのまま HTML として出力したい場合もあります。このような場合には、明示的に HTML エンコードをおこなわないようにコーディングすることになります。

ASP.NET MVC 3 では、以下の 2 つの方法によって、HTML 文字列をそのままビューに出力することが可能です。

１．Html.Raw メソッドの利用

ASP.NET MVC 3 より追加された Html.Raw メソッドを使って、明示的に HTML 文字列をそのままレンダリングすることができます。

 @{
    var htmlString = "<h1>Razor いいね！</h1>";
}

<div>@Html.Raw(htmlString)</div>

実行結果

HTML ソース

　

２．HtmlString クラス オブジェクトを利用

もうひとつの方法は HtmlString クラス オブジェクトを用いる方法です。

 @{
    var htmlString = "<h1>Razor いいね！</h1>";
}

<div>@(new HtmlString(htmlString))</div>

実行結果は上記の Html.Raw を用いた場合と同じですので割愛します。

■■■

このように、ASP.NET MVC 3 (Razor) では、いままで以上に簡単に、かつセキュアに Web ページを記述することができるようになっています。

そして、弊社 VP の Scott Guthrie も、先日のブログポスト の中で、”ASP.NET MVC 3 will RTM in less than 2 weeks from today. ” とさりげなく書いているとおり、この ASP.NET MVC 3 の正式リリース (RTM) が、この 1 月中旬に予定されています。

お楽しみに！