@Controllerを使って、画面遷移を実現する。
@Controller
1. Spring MVCのコントローラを指定するときに使用
2. @Controllerは主にビュー名を返却するために使用
「classpath:templetes/ + "ビュー名" + .html」が画面のパスになる。
※以下のような流れでSpring MVC Containerはクライアントのリクエストからビューを返却します。
■流れ説明
・ HTTPリクエストを受信した後、DispatcherServletはHandlerMapping を参照して、適切なコントローラーを呼び出します。
・ コントローラは、要求を受け取り、使用GETまたはPOSTメソッドに基づいて、適切なサービスメソッドを呼び出します。serviceメソッドは、定義されたビジネスロジックに基づいてモデルデータを設定し、ビュー名をDispatcherServletに返します。
・ DispatcherServletはからの助けを取るViewResolverピックアップへの要求のために定義されたビューを生成する。
・ ビューが完成すると、DispatcherServletはモデルデータをビューに渡し、ビューは最終的にブラウザにレンダリングされます。
検証
ビュー(HTMLファイル)作る
1. HTMLの空ファイル作成
プロジェクトの下記ディレクトリーの配下に「hello.html」を作成する。
src/main/templetes
2. HTMLの編集
1で作成されたhello.htmlに下記ソースを貼り付けて。
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<!-- (1)共通headerで置き換える -->
<head th:replace="~{common/common :: meta_header('挨拶',~{::link},~{::script})}">
<!-- (2)このページ固有で読み込むCSS/JS -->
<link rel="stylesheet" th:href="@{/css/book/book-list.css}" />
</head>
<body>
<!-- ヘッダの読み込む -->
<div th:replace="~{common/common :: header}"></div>
<!-- メニューの読み込む -->
<div th:replace="~{common/common :: menu}"></div>
<div class="text-center">
<h1>ブック管理一覧画面</h1>
</div>
<div id="book-list" v-cloak>
Hello World!
</div>
<script>
const vBookList = new Vue({
el: "#book-list",
data: {
},
methods: {
},
async mounted() {
}
})
</script>
</body>
Controllerクラスを作る
1. Javaクラスファイル作成
プロジェクトの下記ディレクトリーの配下に「Greeting.java」を作成する。
src/main/java/jp/co/picasoft/training/view/controller
2. Javaクラスファイルの編集
1で作成されたGreeting.javaに下記ソースを貼り付けて。
※javaファイル中のパッケージ情報を変更しないでください。
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
@Controller
@RequestMapping("/greeting")
public class Greeting {
@GetMapping
public String greeting() {
return "hello";
}
}
動作確認
1. アプリケーション起動
「Ctrl+p」をクリックして、「TrainingApplication」を入力して、「TrainingApplication.java」を開いて、
「main」メソッド上の「run」または「debug」をクリックして、アプリケーションを起動する。
2. ブラウザで動作確認
ブラウザを起動して、アドレスバーに「http://localhost:8080/greeting」を入力して、「Enter」キーをクリックして、先作成した「hello.html」により生成したビューを表示されます。
補足
@Controllerはビューの返却に使うだけじゃなくて、下記のような「@ResponseBody」の指定すれば、JSON形式のデータも返却できる。
@GetMapping(value = "/some")
public @ResponseBody Map<String, String> retrieveUserInfo() {
Map<String, String> m = new HashMap<>();
m.put("id", "1");
m.put("name", "田中雄一");
return m;
}
※以下のような流れでクライアントのリクエストからJson形式のデータを返却します。
・クライアントがWeb Serviceにリクエストを送ります。
・MappingのHandlerとそのTypeをサーチするDispatcherServletにリクエストをインターセプトします。
・RestControllerまたは「@Controller + @ResponseBody 」はリクエストの処理を行い、データを返却します。