开篇词
该指南将引导你使用 Spring 创建和提交 Web 表单。
你将创建的应用
在该指南中,我们将构建一个 Web 表单,该表单可以通过以下 URL 访问:http://localhost:8080/greeting。
在浏览器中查看该页面将显示该表单。我们可以通过填充 id
和 content
表单字段来提交问候语。提交表单后将显示结果页面。
你将需要的工具
- 大概 15 分钟左右;
- 你最喜欢的文本编辑器或集成开发环境(IDE)
- JDK 1.8 或更高版本;
- Gradle 4+ 或 Maven 3.2+
- 你还可以将代码直接导入到 IDE 中:
如何完成这个指南
像大多数的 Spring 入门指南一样,你可以从头开始并完成每个步骤,也可以绕过你已经熟悉的基本设置步骤。如论哪种方式,你最终都有可以工作的代码。
- 要从头开始,移步至从 Spring Initializr 开始;
- 要跳过基础,执行以下操作:
- 下载并解压缩该指南将用到的源代码,或借助 Git 来对其进行克隆操作:
git clone https://github.com/spring-guides/gs-handling-form-submission.git
- 切换至
gs-handling-form-submission/initial
目录; - 跳转至该指南的创建 Web 控制器。
- 下载并解压缩该指南将用到的源代码,或借助 Git 来对其进行克隆操作:
待一切就绪后,可以检查一下 gs-handling-form-submission/complete
目录中的代码。
从 Spring Initializr 开始
对于所有的 Spring 应用来说,你应该从 Spring Initializr 开始。Initializr 提供了一种快速的方法来提取应用程序所需的依赖,并为你完成许多设置。该示例需要 Spring Web 和 Thymeleaf 依赖。下图显示了此示例项目的 Initializr 设置:
上图显示了选择 Maven 作为构建工具的 Initializr。你也可以使用 Gradle。它还将
com.example
和handling-form-submission
的值分别显示为 Group 和 Artifact。在本示例的其余部分,将用到这些值。
以下清单显示了选择 Maven 时创建的 pom.xml
文件:
<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>2.2.2.RELEASE</version>
<relativePath/> <!-- lookup parent from repository -->
</parent>
<groupId>com.example</groupId>
<artifactId>handling-form-submission</artifactId>
<version>0.0.1-SNAPSHOT</version>
<name>handling-form-submission</name>
<description>Demo project for Spring Boot</description>
<properties>
<java.version>1.8</java.version>
</properties>
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-test</artifactId>
<scope>test</scope>
<exclusions>
<exclusion>
<groupId>org.junit.vintage</groupId>
<artifactId>junit-vintage-engine</artifactId>
</exclusion>
</exclusions>
</dependency>
</dependencies>
<build>
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
</plugin>
</plugins>
</build>
</project>
以下清单显示了在选择 Gradle 时创建的 build.gradle
文件:
plugins {
id 'org.springframework.boot' version '2.2.2.RELEASE'
id 'io.spring.dependency-management' version '1.0.8.RELEASE'
id 'java'
}
group = 'com.example'
version = '0.0.1-SNAPSHOT'
sourceCompatibility = '1.8'
repositories {
mavenCentral()
}
dependencies {
implementation 'org.springframework.boot:spring-boot-starter-thymeleaf'
implementation 'org.springframework.boot:spring-boot-starter-web'
testImplementation('org.springframework.boot:spring-boot-starter-test') {
exclude group: 'org.junit.vintage', module: 'junit-vintage-engine'
}
}
test {
useJUnitPlatform()
}
创建 Web 控制器
在 Spring 建立网站的方法中,HTTP 请求由控制器处理。这些组件可以通过 @Controller
注解来轻松识别。以下清单中的 GreetingController
(来自 src/main/java/com/example/handlingformsubmission/GreetingController.java
)通过返回 View
的名称(在该例中为 greeting
)来处理 /greeting
的 GET 请求。以下 View
负责渲染 HTML 内容:
package com.example.handlingformsubmission;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.PostMapping;
@Controller
public class GreetingController {
@GetMapping("/greeting")
public String greetingForm(Model model) {
model.addAttribute("greeting", new Greeting());
return "greeting";
}
@PostMapping("/greeting")
public String greetingSubmit(@ModelAttribute Greeting greeting) {
return "result";
}
}
该控制器简洁明了,但其处理了很多细节。该节的其余部分将逐步对其进行分析。
映射注释使我们可以将 HTTP 请求映射到特定的控制器方法。该控制器中的两个方法都映射到 /greeting
。我们可以使用 @RequestMapping
(默认情况下,它映射所有 HTTP 操作,例如 GET
、POST
等等)。但是,在这种情况下,greetingForm()
方法通过使用 @GetMapping
注解来专门映射至 GET
,而 greetingSubmit()
则通过 @PostMapping
来映射至 POST
。该映射使控制器可以区分对 /greeting
端点的请求。
greetingForm()
方法使用 Model
对象将新的 Greeting
暴露给视图模版。以下代码中的 Greeting
对象(来自 src/main/java/com/example/handlingformsubmission/Greeting.java
)包含诸如 id
和 content
之类的字段,这些字段与 greeting
视图中的表单字段相对应,并用于从表单中捕获信息:
package com.example.handlingformsubmission;
public class Greeting {
private long id;
private String content;
public long getId() {
return id;
}
public void setId(long id) {
this.id = id;
}
public String getContent() {
return content;
}
public void setContent(String content) {
this.content = content;
}
}
方法主体的实现依赖于视图技术,通过将视图名称(greeting
)转换为要渲染的模版来执行 HTML 的服务端渲染。在这种情况下,我们使用 Thymeleaf,它解析 greeting.html
模版并评估各种模版表达式以渲染表单。以下清单(来自 src/main/resources/templates/greeting.html
)显示了 greeting
模版:
<!DOCTYPE HTML>
<html xmlns:th="https://www.thymeleaf.org">
<head>
<title>Getting Started: Handling Form Submission</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<h1>Form</h1>
<form action="#" th:action="@{/greeting}" th:object="${greeting}" method="post">
<p>Id: <input type="text" th:field="*{id}" /></p>
<p>Message: <input type="text" th:field="*{content}" /></p>
<p><input type="submit" value="Submit" /> <input type="reset" value="Reset" /></p>
</form>
</body>
</html>
th:action="@{/greeting}"
表达式将表单定向至 /greeting 的 POST 端点,而 th:object="${greeting}"
表达式声明用于收集表单数据的模型对象。用 th:field="{id}"
和 th:field="{content}"
表示的两个表单字段对应于与 Greeting 对象中的字段。
这涵盖了用于渲染表单的控制器、模型以及视图。现在,我们可以回顾提交表单的过程。如前所述,该表单通过使用 POST
调用提交到 /greeting
端点。greetingSubmit()
方法接收由表单填充的 Greeting
对象。Greeting
是一个 @ModelAttribute
,因此它被绑定至表单传入的内容。同时,还可以通过按名称引用提交的数据来渲染 result
视图(默认情况下为方法参数的名称,在该案例中为 greeting
)。id
在 <p th:text="'id: ' + ${greeting.id}" />
表达式中被渲染。以下清单(来自 src/main/resources/templates/result.html
)显示了结果模版:
<!DOCTYPE HTML>
<html xmlns:th="https://www.thymeleaf.org">
<head>
<title>Getting Started: Handling Form Submission</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<h1>Result</h1>
<p th:text="'id: ' + ${greeting.id}" />
<p th:text="'content: ' + ${greeting.content}" />
<a href="/greeting">Submit another message</a>
</body>
</html>
为清晰起见,该示例使用两个单独的视图模版来呈现表单和显示提交的数据。但是,我们可以同时使用两个视图。
使应用可执行
尽管我们可以将该服务打包为传统的 WAR 文件,以部署至外部应用服务器,但是更简单的方法是创建一个独立的应用。我们将所有内容打包至一个可执行的 JAR 文件中,由一个普通 Java main()
方法来驱动。在该过程中,我们使用 Spring 的支持来将 Tomcat servlet 容器作为 HTTP 运行时嵌入其中,而不是部署到外部实例。以下清单(来自 src/main/java/com/example/handlingformsubmission/HandlingFormSubmissionApplication.java
)显示了应用类:
package com.example.handlingformsubmission;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
@SpringBootApplication
public class HandlingFormSubmissionApplication {
public static void main(String[] args) {
SpringApplication.run(HandlingFormSubmissionApplication.class, args);
}
}
@SpringBootApplication
是一个便利的注解,它添加了以下所有内容:
@Configuration
:将类标记为应用上下文 Bean 定义的源;@EnableAutoConfiguration
:告诉 Spring Boot 根据类路径配置、其他 bean 以及各种属性的配置来添加 bean。@ComponentScan
:告知 Spring 在com/example
包中寻找他组件、配置以及服务。
main()
方法使用 Spring Boot 的 SpringApplication.run()
方法启动应用。
构建可执行 JAR
我们可以结合 Gradle 或 Maven 来从命令行运行该应用。我们还可以构建一个包含所有必须依赖项、类以及资源的可执行 JAR 文件,然后运行该文件。在整个开发生命周期中,跨环境等等情况下,构建可执行 JAR 可以轻松地将服务作为应用进行发布、版本化以及部署。
如果使用 Gradle,则可以借助 ./gradlew bootRun
来运行应用。或通过借助 ./gradlew build
来构建 JAR 文件,然后运行 JAR 文件,如下所示:
java -jar build/libs/gs-handling-form-submission-0.1.0.jar
由官网提供的以上这条命令的执行结果与我本地的不一样,我需要这样才能运行:
java -jar build/libs/handling-form-submission-0.0.1-SNAPSHOT.jar
。
如果使用 Maven,则可以借助 ./mvnw spring-boot:run
来运行该用。或可以借助 ./mvnw clean package
来构建 JAR 文件,然后运行 JAR 文件,如下所示:
java -jar target/gs-handling-form-submission-0.1.0.jar
由官网提供的以上这条命令的执行结果与我本地的不一样,我需要这样才能运行:
java -jar target/handling-form-submission-0.0.1-SNAPSHOT.jar
。
我们还可以将 JAR 应用转换成 WAR 应用。
显示日志记录输出。该服务应在几秒内启动并运行。
测试服务
现在,该网站正在运行,请访问 http://localhost:8080/greeting,在其中我们可以看到以下表单:
提交 ID 和消息以查看结果:
概述
恭喜你!我们刚刚使用 Spring 创建并提交了一个表单。
参见
以下指南也可能会有所帮助:
想看指南的其他内容?请访问该指南的所属专栏:《Spring 官方指南》