【左京淳的Spring学习笔记】基础案例

使用首页、输入画面、输出画面等三个基础画面，来熟悉画面之间跳转及资料移动的原理。本练习不涉及业务逻辑的开发及资料库的使用。

IDE(统合开发环境): STS for Eclipse

官网下载点
https://spring.io/tools

专案类型: Maven专案

让Maven来帮忙管理各类jar包的导入，我们只需决定大类就好。
File->New->Project->Maven Project
在Select an Archetype画面，搜寻maven-archetype-webapp(可能需要一点时间)
选择org.apache的纯正梅粉
输入自己定义的组织(Example)和专案名称(BaseSite)

修改pom.xml

可在网站根目录下看到此档案，打造一个webApp所需要的建材清单都在这，只需填入大类名称，细节由梅粉搞定。
追加以下资源

Spring-ioservlettaglib
注:除了Spring-io独立放在内，其他的资源可追加到既存的範围内即可。

  <dependencyManagement>  <dependencies>    <dependency>      <groupId>io.spring.platform</groupId>      <artifactId>platform-bom</artifactId>      <version>Cairo-SR8</version>      <type>pom</type>      <scope>import</scope>    </dependency>  </dependencies>  </dependencyManagement>  <dependencies>    <dependency>      <groupId>javax.servlet</groupId>      <artifactId>javax.servlet-api</artifactId>      <scope>provided</scope>    </dependency>    <dependency>      <groupId>org.apache.taglibs</groupId>      <artifactId>taglibs-standard-jstlel</artifactId>    </dependency>  </dependencies>

注:版本号可省略，但大型专案建议写上。

指定java版本(依照自己使用的版本设定即可)

在maven-compiler-plugin下面追加内容如下例:

          <artifactId>maven-compiler-plugin</artifactId>          <version>3.8.0</version>          <configuration>            <source>8</source>            <target>8</target>          </configuration>

按Alt + F5更新maven以反映pom的设定

修改web.xml

web.xml是伺服器启动时会读取的清单
路径: src->main->webapp->WEB-INF->web.xml
用以下的内容覆写原本内容

<?xml version="1.0" encoding="UTF-8"?><web-app xmlns="http://java.sun.com/xml/ns/javaee"  xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"  xsi:schemaLocation="   http://java.sun.com/xml/ns/javaee    http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd  "  version="3.0">  <jsp-config>        <jsp-property-group>          <url-pattern>*.jsp</url-pattern>          <page-encoding>UTF-8</page-encoding>          <include-prelude>/WEB-INF/include.jsp</include-prelude>        </jsp-property-group>  </jsp-config></web-app>

jsp-config表示套用到所有的jsp档案的设定。这样就不用自行在jsp页面中进行嵌套。
本範例使用UTF-8，且自动加载include.jsp

include.jsp作成

在/WEB-INF下新增一个include.jsp档案
并在里面加入以下内容(jsp档案用的基本标籤库)

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %><%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %><%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>

新增server

Window->Preferences->Server->Runtime Environments->Add->Apache Tomcat v9.0
勾选Create a new local server

将专案布署到server

在server名称上点右键->Add and Remove->Add

启动伺服器

选择server并按下绿色播放键

在浏览器上确认运行成功

http://localhost:8080/BaseSite/

停止伺服器

按下红色方块停止键

到目前为止，确认了专案可挂载到server上运行

在pom.xml档案进行library设定(导入jar包)

在 範围内追加以下内容

    <!--Spring MVC START-->    <dependency>      <groupId>org.springframework</groupId>      <artifactId>spring-webmvc</artifactId>    </dependency>    <dependency>      <groupId>org.hibernate</groupId>      <artifactId>hibernate-validator</artifactId>    </dependency>    <dependency>      <groupId>org.slf4j</groupId>      <artifactId>jcl-over-slf4j</artifactId>    </dependency>    <dependency>      <groupId>ch.qos.logback</groupId>      <artifactId>logback-classic</artifactId>    </dependency>            <!--Spring MVC END-->

保存档案后按alt+f5 让maven更新

新增source folder

新增folder->路径: src/main/->名称: java (用来放置class档案)

建立DI容器

DI容器里面可以放各种设定档与java bean可以用文字档配置，也可以使用Java的class进行配置。本案例使用class档。DI容器可以有多个，包含自定义容器以及Spring MVC所使用的制式DI容器(※需实现WebMvcConfigurer接口)

自定义DI容器

新建AppConfig.class
路径:src/main/java/example/config/AppConfig.class
本档案不设定任何内容，仅在类名前加上"@Configuration"注记，供Spring扫描。

package example.config;import org.springframework.context.annotation.Configuration;@Configurationpublic class AppConfig {}

设定ContextLoadListener(监听器)

此监听器的功能是让Servlet启动时，能带着DI容器一起启动。
在WEB-INF/web.xml内追加以下设定

    <!--Spring MVC START-->  <listener>    <listener-class>      org.springframework.web.context.ContextLoaderListener    </listener-class>  </listener>  <context-param>    <param-name>contextClass</param-name>    <param-value>      org.springframework.web.context.support.AnnotationConfigWebApplicationContext    </param-value>  </context-param>  <context-param>    <param-name>contextConfigLocation</param-name>    <param-value>example.config.AppConfig</param-value>  </context-param>       <!--Spring MVC END-->

制式DI容器

新建WebMvcConfig.class

@Configuration@EnableWebMvc@ComponentScan("example.app")public class WebMvcConfig implements WebMvcConfigurer {}

注:

@Configuration 表示这是一个设定档@EnableWebMvc 自动载入MVC相关bean和设定档@ComponentScan("example.app") 指定注解扫瞄範围

设定DispatcherServlet

DispatcherServlet是Spring公司提供的制式Servlet，负责对应使用者的各种请求。
在web.xml追加以下内容

    <servlet>    <servlet-name>app</servlet-name>    <servlet-class>      org.springframework.web.servlet.DispatcherServlet    </servlet-class>    <init-param>      <param-name>contextClass</param-name>      <param-value>        org.springframework.web.context.support.AnnotationConfigWebApplicationContext      </param-value>    </init-param>    <init-param>      <param-name>contextConfigLocation</param-name>      <param-value>example.config.WebMvcConfig</param-value>    </init-param>    <load-on-startup>1</load-on-startup>  </servlet>   <servlet-mapping>    <servlet-name>app</servlet-name>    <url-pattern>/</url-pattern>  </servlet-mapping>

搭配制式DI容器使用(WebMvcConfig)。对应的url範围可以指定初始值从springframework拿，也可以在WebMvcConfig里追加。

设定CharacterEncodingFilter(防止乱码)

除了HTML预设的ISO 8859-1编码之外，使用其他的编码输入文字的话都需要这个过滤器
在web.xml内追加以下内容

  <filter>    <filter-name>CharacterEncodingFilter</filter-name>    <filter-class>      org.springframework.web.filter.CharacterEncodingFilter        </filter-class>    <init-param>      <param-name>encoding</param-name>      <param-value>UTF-8</param-value>    </init-param>    <init-param>      <param-name>ForceEncoding</param-name>      <param-value>true</param-value>    </init-param>  </filter>  <filter-mapping>    <filter-name>CharacterEncodingFilter</filter-name>    <url-pattern>/*</url-pattern>  </filter-mapping>

记忆重点

我们在web.xml里面设定了

ContextLoadListener(监听器)CharacterEncodingFilter(过滤器)DispatcherServlet

并利用class档 + @Configuration注释的方式，建立了自製及制式的两个DI容器
提供给ContextLoadListener和DispatcherServlet使用

设定ViewResolver

指定由谁担任MVC中view的角色，常见的是指定jsp档案来担任。
修改WebMvcConfig，覆写以下方法。

@Overridepublic void configureViewResolvers(ViewResolverRegistry registry) {registry.jsp(); //使用jsp()方法，让放在WEB-INF下的jsp档案都会被扫描到}

在include.jsp内追加MVC用标籤

<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %> <%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %> 

Controller作成

新增example.app包
在其下新增class档案WelcomeController

package example.app;import org.springframework.stereotype.Controller;import org.springframework.web.bind.annotation.RequestMapping;@Controllerpublic class WelcomeController {  @RequestMapping("/")  public String home() {  return "index"; //当用户进入首页，就呼叫名称为index的jsp档案(需放在WEB-INF资料夹下)  }}

把原先放在webapp下的index.jsp移动到WEB-INF资料夹下
启动伺服器并打开浏览器确认设定正确
http://localhost:8080/BaseSite/

此时是经由WelcomeController导向index页，与之前自动读取webapp下的index.jsp不同(档案放的地方也不一样了)。

确认首页能经由Servlet显示后，接下来建立可输入文字的页面以及可显示结果的页面。
在index页面追加输入页面的连结(因为有中文，存档时会跳警告，请存为utf-8格式。)

<html><body><h2>Hello World!</h2><ul>  <li><a href="<c:url value='/echo' />">前往输入页面</a></li></ul></body></html>

要接收用户输入的资料，需要一个储存表单用的EchoForm.class
在example.app包下追加它
※需要实现Serilizable接口

package example.app;import java.io.Serializable;public class EchoForm implements Serializable {private static final long serialVersionID = 1L;private String text;public String getText() {return text;}public void setText(String text) {this.text = text;}}

里面单纯的放一个String型变数text来接收使用者输入的文字，并设定get,set方法。

新增EchoController

用来处理输入页面的请求

package example.app;import org.springframework.stereotype.Controller;import org.springframework.ui.Model;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.bind.annotation.RequestMethod;@Controller@RequestMapping("echo")  //当url路径为/echo时触发此Controllerpublic class EchoController {  @RequestMapping(method = RequestMethod.GET)  //当请求方法为get时触发此方法  public String viewInput(Model model) {  //model是Spring提供的打包用物件，取代了request的运送功能。  EchoForm form = new EchoForm();  model.addAttribute(form);  //使用model的addAttribute()方法把资料放进model里，属性名会自动设定为物件名(echoForm)，字首会转为小写。  return "echo/input";  }}

在WEB-INF/echo下建立input.jsp

<html><body>  <h2>输入画面</h2>  <form:form modelAttribute="echoForm">    <div>请输入文字：</div>    <div>      <form:input path="text" />    </div>    <div>      <form:button>送信</form:button>    </div>  </form:form></body></html>

以上input页面的实装完成，接下来进行output页面的实装
在EchoController追加POST方法

  @RequestMapping(method = RequestMethod.POST)  public String echo(EchoForm form) {  return "echo/output";  //本案例不对输入文字做任何处理，直接导向output页面  }

在WEB-INF/echo下建立output.jsp

<html><body>  <h2>输出画面</h2>　　<div>输入的文字是...</div>  <div>      「<span><c:out value="${echoForm.text }"></c:out></span>」  </div>  <br>  <div>    <a href="<c:url value='/' />">回首页</a>  </div></body></html>

打开伺服器和页面让我们来看看成功了没…
如果出现中文乱码或是无法识别标籤的情况，请检查web.xml里面是否进行了jsp-config的设定