【T1c】ASP.NET Core MVC(6/6)

プロジェクトタイプ	ASP.NET Core (空)
プロジェクト名	`T1c`
ソリューション名	`PIT1`
ターゲットフレームワーク	.NET 8.0(長期的なサポート)
最上位レベルのステートメントを使用しない	使用する(チェックオフ)

注意

本ページの作業内容は 前のページまでの続き になっていることに注意せよ．
- 先に前のページまでをすべて読み，指示されている作業を済ませてから本ページを読むこと．
- プロジェクトの作成作業についてはプロジェクトの作成を参照せよ．

1c-6. HTTPにおけるアクセス方法の種類

重要な点として，フォームの送信を受け付けるアクションメソッドには，リスト1c-5-3の1行目のように [HttpPost]属性を付加する必要があることを覚えておこう ．

ここでHTTPにおけるアクセス方法の種類についても少し説明しておこう．ウェブを閲覧している限りは通常はあまり意識されないが，ウェブにおけるリソースへのアクセス方法はいくつか存在している．ウェブアプリケーションの開発において重要なのは以下の2種類である．

GETメソッド
- リスト1c-5-2のような通常のリンクをクリックした際に発生するアクセス方法(_)．
POSTメソッド
- フォームの送信の際に発生するアクセス方法(_)．

ウェブブラウザはページの内容に基づいて，GETメソッドでアクセスするかPOSTメソッドでアクセスするかを使い分けている．ASP.NET Core MVC におけるコントローラーのアクションメソッドは，通常はGETメソッドでアクセスされた際に呼び出されるがリスト1c-5-3のように[HttpPost]属性を付加することで，「このアクションメソッドはFoo/CalcBMIにPOSTメソッドでアクセスされた際に起動するものである」とマークすることができる．

リスト1c-5-3ではBMIの値を計算してViewDataという連想配列にデータを登録している．この ViewDataはビュー，つまりRazorページの表示処理に任意のデータを渡すことができる汎用コンテナ であり今回は "bar" というキーに，計算したBMIの値を登録している (「連想配列」についてはプログラミング演習Ⅲ(2023;金澤クラス)第06回を参照せよ)．

リスト1c-5-3はCalcBMIという名前のアクションメソッドなので，特に指定しなければ表示には先ほど作成した CalcBMI.cshtml が使用される．では CalcBMI.cshtml の中で， ViewDataに登録されたBMIの値を読みだして表示する処理を書き加えよう． _のように追記する．

Foo/CalcBMI.cshtmlへの追記内容

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
@{
    Layout = null;
}

<!DOCTYPE html>

<html lang="ja">
<head>
    <meta name="viewport" content="width=device-width" />
    <title>CalcBMI</title>
</head>
<body>
    <h1>今見てるのは FooコントローラのCalcBMIアクション</h1>

    <h2>BMI計算機</h2>

    @if (ViewData["bar"] != null)
    {
        <p>BMI は @ViewData["bar"] です。</p>
    }

    <form method="post">
        体重(kg): <input type="number" name="weight" min="1" step="0.1" required /><br />
        身長(cm): <input type="number" name="height" min="1" step="0.1" required /><br />
        <input type="submit" value="送信" />
    </form>
</body>

</html>

18～21行目では，ViewDataの "bar" キーに値が入っていたときのみ p 要素内の文章でその値を表示している．ここまで追記したら起動して，フォームに適当なデータを入力してBMIの値が表示されることを確認しよう(_)．

以上で今回のチュートリアルは完了である． なお今回は課題が出題されている．忘れずに取り組むこと ．

Last updated on 2024-04-12
Published on 2024-04-12