本文首发于个人网站: Spring Boot构建的Web项目如何在服务端校验表单输入
这个例子用于演示在Spring Boot应用中如何验证Web 应用的输入,我们将会建立一个简单的Spring MVC应用,来读取用户输入并使用validation注解来检查,并且当用户输入错误时,应用需要再屏幕上显示错误信息提示用户重新输入。
首先构建Maven项目,该项目的pom文件内容如下:
<?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 http://maven.apache.org/xsd/maven-4.0.0.xsd"> <modelVersion>4.0.0</modelVersion> <groupId>org.example</groupId> <artifactId>validating-form-input</artifactId> <version>1.0-SNAPSHOT</version> <parent> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-parent</artifactId> <version>1.5.1.RELEASE</version> </parent> <properties> <java.version>1.8</java.version> </properties> <build> <plugins> <plugin> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-maven-plugin</artifactId> </plugin> </plugins> </build> <dependencies> <!-- thymeleaf模板,用于前段渲染 --> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency> <!-- 用于输入验证 --> <dependency> <groupId>org.hibernate</groupId> <artifactId>hibernate-validator</artifactId> </dependency> <!-- 用于支持嵌入式tomcat --> <dependency> <groupId>org.apache.tomcat.embed</groupId> <artifactId>tomcat-embed-el</artifactId> </dependency> <!-- 用于spring boot应用的测试 --> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-test</artifactId> <scope>test</scope> </dependency> </dependencies> </project>
Spring Boot Maven插件提供了很多方便的特性:
创建一个Form对象,用于对应HTML页面中输入的对象——PersonForm,
package hello; import javax.validation.constraints.Min; import javax.validation.constraints.NotNull; import javax.validation.constraints.Size; /** * Created by IntelliJ IDEA. * User: duqi * Date: 2017/2/28 * Time: 21:53 */ public class PersonForm { @NotNull @Size(min = 2, max = 30) private String name; @NotNull @Min(18) private Integer age; public String getName() { return name; } public Integer getAge() { return age; } public void setName(String name) { this.name = name; } public void setAge(Integer age) { this.age = age; } public String toString() { return "Person(Name: " + this.name + ", Age: " + this.age + ")"; } }
在这里,@NotNull注解表示该属性不能为空、@Size(min=2, max=30)表示name属性的长度在[2,30]之间,@Min(18)表示age属性最小值为18。
编写一个web控制器,引用为:src/main/java/hello/WebController.java,代码如下:
package hello; import org.springframework.stereotype.Controller; import org.springframework.validation.BindingResult; import org.springframework.web.bind.annotation.GetMapping; import org.springframework.web.bind.annotation.PostMapping; import org.springframework.web.servlet.config.annotation.ViewControllerRegistry; import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter; import javax.validation.Valid; /** * Created by IntelliJ IDEA. * User: duqi * Date: 2017/3/2 * Time: 14:07 */ @Controller public class WebController extends WebMvcConfigurerAdapter { @Override public void addViewControllers(ViewControllerRegistry registry) { registry.addViewController("/results").setViewName("results"); } @GetMapping("/") public String showForm(PersonForm personForm) { return "form"; } @PostMapping("/") public String checkPersonInfo(@Valid PersonForm personForm, BindingResult bindingResult) { if (bindingResult.hasErrors()) { return "form"; } return "redirect:/results"; } }
在这个控制器中,GET方法和POST方法都映射到“/”url下,showForm方法会返回“form”字符串,表示模板的名称,视图控制器根据这个字符串查找模板文件form.html,在 showForm
的方法签名中定义了PersonForm参数,以便模板将属性绑定到PersonForm对象的属性中, checkPersonFormInfo
方法定义了两个入参:(1)person对象,在这个参数前用@Valid修饰,用于检查从form页面提交过来的属性值;(2)bindingResult对象,用于存放@Valid注解检查的结果。
可以从PersonForm表格中提取属性值,并存入PersonForm对象。@Valid注解会检查这些属性的有效性,如果有错也会把错误信息渲染到模板中并显示到页面上。
如果所有的属性都通过校验,该方法会将浏览器重定向到results页面。
spring boot默认从src/main/resources/templates目录下查找html页面,form.html和results.html都放在这里。
<!DOCTYPE html> <html xmlns:th="http://www.thymeleaf.org"> <head> <title>Spring Boot Thymeleaf Hello World Example</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> </head> <body> <form action="#" th:action="@{/}" th:object="${personForm}" method="post"> <table> <tr> <td>Name:</td> <td><input type="text" th:field="*{name}" /></td> <td th:if="${#fields.hasErrors('name')}" th:errors="*{name}">Name Error</td> </tr> <tr> <td>Age:</td> <td><input type="text" th:field="*{age}" /></td> <td th:if="${#fields.hasErrors('age')}" th:errors="*{age}">Age Error</td> </tr> <tr> <td><button type="submit">Submit</button></td> </tr> </table> </form> </body> </html>
form.html页面包含一个简单的form表格,这个表格和post方法绑定。 th:object
表示该表格和后端的person对象绑定,这就是 bean-backed form ,在PersonForm对象中,可以看到 th:field="*{name}"
和 th:field=*{age}
。在form表格中,紧挨着name和age标签,有两个用于显示错误信息的标签。页面的最后有个Submit按钮,如果用户输入的name和age不合法,页面会显示错误提示信息,如果用户输入的name和age不合法,页面会被路由到下一个页面。
results.html内容如下:
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8" /> <title>Title</title> </head> <body> Congratulations! You are old enough to sign up for this site. </body> </html>
创建一个Application类,用于启动Spring Boot应用,
package hello; import org.springframework.boot.SpringApplication; import org.springframework.boot.autoconfigure.SpringBootApplication; /** * Created by IntelliJ IDEA. * User: duqi * Date: 2017/3/2 * Time: 15:50 */ @SpringBootApplication public class Application { public static void main(String[] args) { SpringApplication.run(Application.class, args); } }
@SpringBootApplication注解也为Thymeleaf提供了默认配置:默认情况下会从resources/templates目录下查找模板文件,并将*.html文件中的后缀忽略掉后剩下的文件名称解析为视图。可以通过在application.properties里设置相关属性来修改Thymeleaf的配置,这里我们不再细说。
演示的代码:https://github.com/duqicauc/validatingforminput
本号专注于后端技术、JVM问题排查和优化、Java面试题、个人成长和自我管理等主题,为读者提供一线开发者的工作和成长经验,期待你能在这里有所收获。