ASP.NET CoreでJavaScriptのfetch関数を使う - 版の履歴

2024年3月7日 (木) 01:39にAdministratorによる

2024-03-07T01:39:09Z

← 古い版		2024年3月7日 (木) 01:39時点における版
11行目:		11行目:
	cshtmlの上部（@pageや@modelなどの直下あたり）に以下を追加する。		cshtmlの上部（@pageや@modelなどの直下あたり）に以下を追加する。
	サーバーサイドでCSRFトークンを生成する。		サーバーサイドでCSRFトークンを生成する。
	<source lang="">		<source lang="text">
	@inject Microsoft.AspNetCore.Antiforgery.IAntiforgery Antiforgery		@inject Microsoft.AspNetCore.Antiforgery.IAntiforgery Antiforgery
	@{		@{

2024年3月7日 (木) 01:38にAdministratorによる

2024-03-07T01:38:55Z

← 古い版		2024年3月7日 (木) 01:38時点における版
2行目:		2行目:

	== 対策 ==		== 対策 ==
	===　~~service~~ ===		=== service ===
	サービスの設定は.NET 8系のテンプレートだとProgram.csにある。		サービスの設定は.NET 8系のテンプレートだとProgram.csにある。
	<source lang="csharp">		<source lang="csharp">

Administrator: ページの作成:「ASP.NET Coreで何も考えずにJavaScriptのfetch関数を使うとCSRF対策機能が働いて400エラー（Bad Request）になります。 == 対策 ==…」

2024-03-07T01:38:41Z

ページの作成:「ASP.NET Coreで何も考えずにJavaScriptのfetch関数を使うとCSRF対策機能が働いて400エラー（Bad Request）になります。 == 対策 ==…」

新規ページ

[[ASP.NET Core]]で何も考えずに[[JavaScript]]のfetch関数を使うと[[CSRF]]対策機能が働いて400エラー（Bad Request）になります。

== 対策 ==
===　service ===
サービスの設定は.NET 8系のテンプレートだとProgram.csにある。
<source lang="csharp">
builder.Services.AddAntiforgery(x => x.HeaderName = "X-CSRF-TOKEN");
</source>

=== cshtml ===
cshtmlの上部（@pageや@modelなどの直下あたり）に以下を追加する。
サーバーサイドでCSRFトークンを生成する。
<source lang="">
@inject Microsoft.AspNetCore.Antiforgery.IAntiforgery Antiforgery
@{
var requestToken = Antiforgery.GetAndStoreTokens(this.HttpContext).RequestToken;
}
</source>

=== javascript ===
fetch関数のheadersにCSRFトークンを展開する。
<source lang="javascript">
var data = { "head":"hage" }
fetch('/human', {
method: 'POST',
headers: {
"X-CSRF-TOKEN": "@requestToken",
"Content-Type": "application/json",
"Accept": "application/json"
},
body: JSON.stringify(data)
});
</source>

おわり

== 関連項目 ==
* [[ASP.NET CoreのPageModelのOnPost関数の引数でJSONを受け取る]]

[[category: ASP.NET Core]]