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

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

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

专案类型: Maven专案

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

修改pom.xml

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

Spring-io
servlet
taglib
注:除了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;
@Configuration
public 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，覆写以下方法。

@Override
public 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;

@Controller
public 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时触发此Controller
public 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的设定

<<: 2021 春季 JS 直播班心得

>>: 电子发现参考模型（Electronic Discovery Reference Model）

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

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

专案类型: Maven专案

修改pom.xml

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

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

修改web.xml

include.jsp作成

新增server

将专案布署到server

启动服务器

在浏览器上确认运行成功

停止服务器

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

新增source folder

建立DI容器

自定义DI容器

设定ContextLoadListener(监听器)

制式DI容器

设定DispatcherServlet

设定CharacterEncodingFilter(防止乱码)

记忆重点

设定ViewResolver

在include.jsp内追加MVC用标签

Controller作成

新增EchoController

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

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

Day 08　Section Summary 2

[Day 17] Mattermost - 介绍与安装

[Day25] 程序码重构

06 | WordPress 段落区块 Paragraph Block

Day30 下拉式选单小实作2

Day 23 (Js)

More About Textures

[DAY 29] 章节3-9: 一切都是假象-辛普森悖论(Simpson’s paradox)(统计谬误)

Logger 与 Extension Generator for Kotlin

如何快速上手第三方套件