タグヘルパーを利用せずにクロスサイト要求偽造の__RequestVerificationToken を送信するコードを紹介します。
概要
ASP.NET CoreのRazor Pageでは、デフォルトでクロスサイト要求偽造を防止するための仕組みが有効になっています。
そのため、POST時に、
__RequestVerificationTokenを送信し、値がチェックされ、問題ない場合にのみPOSTでのリクエストが有効になります。
チェックが失敗した場合には、HTTP 400エラーが返ります。
通常はタグヘルパーを導入すると自動で RequestVerificationToken の値が追加されますが、
タグヘルパーを利用しない場合にRequestVerificationToken の値を送信したい場合があります。
この記事では、タグヘルパーを利用せずに RequestVerificationToken を送信するコードを紹介します。
対応方法
Razor Page内に以下のコードを記述します。
プログラム例
.NET 6でASP.NET Coreアプリケーションを作成します。
コード
以下のコードを記述します。
@page
@model AntiforgeryNoTagHelper.Pages.ButtonModel
@{
}
<!DOCTYPE html>
<html>
<head>
<title>Button1</title>
</head>
<body>
<div>Button Demo</div>
<form method="post">
@Html.AntiForgeryToken()
<input type="text" name="TextBoxValue"/>
<input type="submit" value="Button1" />
</form>
<p>@Model.Meassage</p>
</body>
</html>
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
namespace AntiforgeryNoTagHelper.Pages
{
public class ButtonModel : PageModel
{
[BindProperty]
public string TextBoxValue { get; set; } = "";
public string Meassage { get; set; } = "";
public void OnGet()
{
}
public void OnPost()
{
Meassage = "ボタンをクリックしました。TextBox:"+ TextBoxValue;
}
}
}
var builder = WebApplication.CreateBuilder(args);
builder.Services.AddRazorPages();
var app = builder.Build();
app.UseRouting();
app.MapRazorPages();
app.Run();
解説
formタグ内に
@Html.AntiForgeryToken()を記述します。実行時に以下のHTMLタグが出力されます。
<input name="__RequestVerificationToken" type="hidden" value="(値の文字列)" />
上記のコードにより、POSTの際に
__RequestVerificationToken が送信される状態になります。
テキストボックスはタグヘルパーを利用しないため、ページクラスの値を格納するプロパティ名を
name 属性で指定します。
<form method="post">
@Html.AntiForgeryToken()
<input type="text" name="TextBoxValue"/>
<input type="submit" value="Button1" />
</form>
POSTのリクエストにより、OnPostメソッドが呼ばれ、メッセージのテキストをMessage変数(プロパティ)に代入します。
POSTで送信されたテキストボックスの値もMessageに設定します。
public void OnPost()
{
Meassage = "ボタンをクリックしました。TextBox:"+ TextBoxValue;
}
Messageプロパティの値をページに表示します。
<p>@Model.Meassage</p>
実行結果
プロジェクトを実行し、
(アプリケーションルート)/Button URLにアクセスします。下図のページが表示されます。
テキストボックスに入力します。入力後、[Button1]をクリックします。
クリックすると同じページにPOSTしてページ遷移します。テキストボックスの下部にメッセージが表示され、テキストボックスに入力した内容が表示されます。
タグヘルパーを利用せずにPOSTが動作するようになりました。
著者
iPentecのメインプログラマー
C#, ASP.NET の開発がメイン、少し前まではDelphiを愛用
最終更新日: 2022-06-13
作成日: 2022-06-04
