三位一體 (Spring MVC)

第 11 屆 iThome 鐵人賽

DAY 17

Modern Web

美麗的邂逅-與安室....伊春系列第 17 篇

11th鐵人賽

faust

2019-10-02 06:29:22

3439 瀏覽

分享至

分工是為了合作，要合作就要分工。高內聚、低耦合。

MVC = Model, View, Controller
spring-boot-starter-web
tomcat-embed-jasper
@EnableWebMvc

以作戰來作喻，行軍作戰共有三件事，第一是前線對壘，一個是籌備資源，一個是分配這些籌備的資料，對應到程式，前線對壘就是顯示(View)，籌備資源就是資源管理(Model), 而分配資源就是(Controller), 這個分工方式就稱作 MVC。Spring MVC 就是為了提供這種 "三位一體" 的架構。但是Spring框架（沒有Boot）使用起來，實在有點小複雜，因此 Spring Boot 保留了這些架構，但是提供了"許多道的符", 藉由法力，（相對）輕鬆搞定。對! 就是 "司普令符".
如果再具體一點說，M / Model 通常是指資料庫的定義與存取，C / Controller 包含在前面幾回中提到路由，其次是資料的詮釋，在經過特定的處理 (可能與 Domain Know How 有關)，在 V / View 顯示上，在這裡我們尚不介紹 M: Model, 主要在 C: Controller 及 V: View。在上回中，Controller是回傳特定的 HTML 語法，若是要修改HTML的內容，則要重新編譯，也比較受限，MVC架構就是為了分工，分工也意味著，大家可以各自獨立作業，因此 MVC 的架構中，回傳 JSP 的檔名，這樣 JSP 的檔案可以獨立修改，不需編譯就可以自動以新的版本執行。(若要實現這一點，還要配合 tomcat, 這在後面再作介紹)，至少，修改的靈活度要高了許多，修改 View 的工程師（稱作前端工程式）就不必理會Controller的設計。
Spring MVC 的設定原本有點小複雜，透過司普令符，就容易許多。總共有五個步驟，重點如下：（先列出標題，詳細內容在列出全部標題後再陳述)

首先在創建專案時，選擇 Web > Spring Web, 當然，也可以直接修改 pox.xml (Marven) 或 builder.gradle (Gradle) , 增加對 spring-boot-starter-web 的依賴(dependencies) (若是不會修改，請復習第16回：螞粉與蓋兜)。
增加對 tomcat-embed-jasper 的依賴，以Maven為例，在<dependencies>中增加

	<dependency>
		<groupId>org.apache.tomcat.embed</groupId>
		<artifactId>tomcat-embed-jasper</artifactId>
	</dependency>

改一道符，不用 @RestController，改用 @Controller （範例詳於後）。
修改 application.properties 或是使用 @Configuration，@EnableWebMvc
將 JSP 放到指定的位置（在範例中為 src/main/webapp/WEB-INF/view/ 若無則新增）

第 3.點

修改前一回，範例(simpleDemo)中的 RoutingController.java

package com.example.demo;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;

@Controller
public class RoutingController {
    @GetMapping({"/", "/hello"})
    public String sayHello() {
        return "hello";
    }
}

注意到兩點：

使用 @Controller 取代 @RestController
在GetMapping 中，我們也可以包含一個以上的路由，加個大括弧框起來。

第 4.點

然後再修改 src/main/resources/application.properties （若是沒有這個檔案，則新增之）。

# Spring MVC settings
spring.mvc.view.prefix: /WEB-INF/view/
spring.mvc.view.suffix: .jsp

這樣，就設定完成了，前一行 prefix 指明文檔所在的檔案夾, 系統會在前面加上 src/main/webapp/, 因此確實的路徑會是 src/main/webapp/WEB_INF/view（也可以加上檔案的前綴字元，例如我們的檔案名稱是 FILENAME, 我們可以設成WEB-INF/view/; 後一行suffix 指明副檔名為 .jsp, 也可以加上檔名的後綴字元。
這個設定，也可以透過編程來完成，新增類別 SpringConfig，提供 InternalResourceViewResolver

package com.javainterviewpoint;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.EnableWebMvc;
import org.springframework.web.servlet.view.InternalResourceViewResolver;

@Configuration
@EnableWebMvc
public class SpringConfig
{
	@Bean
	public InternalResourceViewResolver viewResolver()
	{
		InternalResourceViewResolver viewResolver = new InternalResourceViewResolver();
		viewResolver.setPrefix("/WEB-INF/view/");
		viewResolver.setSuffix(".jsp");		
		return viewResolver;
	}
}

第 5.點

創建 src/main/webapp/WEB-INF/view/hello.jsp ( File > New > Other > Web > JSP File )

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>simpleDemo</title>
</head>
<body bgcolor=”greenyellow”>
<h2>Hello</h2>
<p>This is Spring Boot MVC Demo， by Faust @ hello.jsp, </p>
<p>Nice to meet you.</p>
</body>
</html>

執行的結果如下：

現在還有兩件事要解決，第一是Controller 如何收資料（由前端送訊息至後端)，第二是Controller 如何發資料(給 JSP，由後端發訊息到前端), 在下面兩回中，我們即將介紹這兩件事。