スポンサーリンク

Get /greeting

@GetMapping

コントローラーGreetingControllerから見ていきます。名前にもControllerと付いてわかりやすいですね。

9行目に@Controllerの記述がありますが、これでこのクラスがコントローラーと宣言しています。

コントローラーはユーザ要求とモデル、モデルとビューを紐づける役割でした。12行目の@GetMapping(“/greeting”)がユーザ要求を定義しています。つまりユーザがブラウザで、

http://<サーバー名>:8080/greeting

と入力した際の紐づけが定義されます。

具体的な紐づけはその後の13行目から記述されており、メソッドgreetingFormが実行されることになります。

14行目で引数のmodelクラス.addAttributeメソッド利用して、ビューに引き渡す値を設定しています。ここでは、モデルGreetingのインスタンスを設定して名前を「greeting」としています。

そして15行目の「return “greeting”;」でビューgreetingの表示を行っています。

まとめるとユーザが

http://<サーバー名>:8080/greeting

と入力するとビューgreetingが表示されます。その際にモデルGreetingがインスタンス化され引き渡されます。

次は呼び出されるビューgreetingを見ていきましょう。

greeting.html

ビューgreetingはファイル「greeting.html」になります。ファイル種類がhtmlなので基本的にはhtmlのコードが書かれていますが、「th:」から始まる命令は、表示を行うThymeleafエンジンの命令になります。この命令によりモデルからデータを取得したり、モデルへデータを設定したりできます。「th:」を中心にコードを見ていきましょう。

最初にth:が出現するのは、9行目のformタグの中に二箇所あります。

一つ目の「 th:action=”@{/greeting}”」でformタグのactionを「/greenting」と指定しています。

つまり、submitが実行されたなら、

http://<サーバー名>:8080/greeting

が発行されます。ここで覚えておいて欲しいのがformタグ内で「metod=”post”」と記述されているのでこのURLはpostで発行されるということです。

二つ目の「th:object=”${greeting}」で、これから操作するオブジェクトは「$greeting」であることを指定しています。

この「$greeting」は、コントローラーでインスタンスを設定した際の名前(“greeting”)にあたります。

次にth:が登場するのは、10行目、11行目です。

それぞれ「th:field=”{・・・}”」の記述があります。このth:fieldはinputタグと上記で指定したオブジェクトのプロパティ(変数)を紐づける命令です。

例えば10行目の「th:field=”*{id}” 」の場合はオブジェクト$greeting(モデルGreetingのインスタンス)のプロパティidとinputタグを紐づけます。もしプロパティidに値が設定されているとデフォルト値として表示されます。※今回は設定されていないので表示されません。

まとめると、greeting.htmlが呼び出されると、inputタグ(id,content)とコントローラーで設定された$greeting(インスタンスGreenting)のプロパティ(id,content)が紐づけられます。もし$greetingのプロパティ(変数)id,contentに値が設定されていればそれぞれinputタグにデフォルト値として表示されます。そしてsubmitボタンが押されると、

http://<サーバー名>:8080/greeting

がpostで発行されます。

ビューの内容がわかりました。次に進みましょう。

タイトルとURLをコピーしました