配置 Web 应用程序表单

本指南将引导您完成配置 Web 应用程序表单以支持验证的过程。

您将构建什么

您将构建一个简单的Spring MVC应用程序，该应用程序接受用户输入并使用标准验证注释检查输入。您还将了解如何在屏幕上显示错误消息，以便用户可以重新输入输入以使其有效。

你需要什么

约15分钟
最喜欢的文本编辑器或 IDE
JDK 1.8或以后
格拉德尔 4+或梅文 3.2+
您也可以将代码直接导入到 IDE 中：

弹簧工具套件（STS）
智能理念
VSCode

如何完成本指南

像大多数春天一样入门指南，您可以从头开始并完成每个步骤，也可以绕过您已经熟悉的基本设置步骤。无论哪种方式，您最终都会得到工作代码。

要从头开始，请继续从 Spring 初始化开始.

要跳过基础知识，请执行以下操作：

下载并解压缩本指南的源存储库，或使用吉特:git clone https://github.com/spring-guides/gs-validating-form-input.git
光盘成gs-validating-form-input/initial
跳转到创建对象PersonForm.

完成后，您可以根据中的代码检查结果。gs-validating-form-input/complete

从 Spring 初始化开始

你可以使用这个预初始化项目，然后单击生成以下载 ZIP 文件。此项目配置为适合本教程中的示例。

手动初始化项目：

导航到https://start.spring.io.此服务拉入应用程序所需的所有依赖项，并为您完成大部分设置。
选择 Gradle 或 Maven 以及您要使用的语言。本指南假定您选择了 Java。
单击“依赖项”，然后选择“Spring Web”、“Thymeleaf”和“验证”。
单击生成。
下载生成的 ZIP 文件，该文件是配置了您选择的 Web 应用程序的存档。

如果您的 IDE 集成了 Spring Initializr，则可以从 IDE 完成此过程。

您也可以从 Github 分叉项目，然后在 IDE 或其他编辑器中打开它。

创建对象`PersonForm`

该应用程序涉及验证用户的姓名和年龄，因此您首先需要创建一个支持用于创建人员的表单的类。以下清单（来自）显示了如何执行此操作：src/main/java/com/example/validatingforminput/PersonForm.java

package com.example.validatingforminput;

import jakarta.validation.constraints.Min;
import jakarta.validation.constraints.NotNull;
import jakarta.validation.constraints.Size;

public class PersonForm {

  @NotNull
  @Size(min=2, max=30)
  private String name;

  @NotNull
  @Min(18)
  private Integer age;

  public String getName() {
    return this.name;
  }

  public void setName(String name) {
    this.name = name;
  }

  public Integer getAge() {
    return age;
  }

  public void setAge(Integer age) {
    this.age = age;
  }

  public String toString() {
    return "Person(Name: " + this.name + ", Age: " + this.age + ")";
  }
}

该类有两个属性：和。它使用一些标准验证注释进行标记：PersonFormnameage

@Size(min=2, max=30)：允许名称长度在 2 到 30 个字符之间。
@NotNull：不允许空值，这是Spring MVC在条目为空时生成的。
@Min(18)：不允许年龄小于18岁。

除此之外，您还可以看到 getter 和 setter 以及一种方便的方法。nameagetoString()

创建 Web 控制器

现在您已经定义了表单支持对象，是时候创建一个简单的 Web 控制器了。以下清单（来自）显示了如何执行此操作：src/main/java/com/example/validatingforminput/WebController.java

package com.example.validatingforminput;

import jakarta.validation.Valid;

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.WebMvcConfigurer;


@Controller
public class WebController implements WebMvcConfigurer {

  @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 方法。这两种方法都映射到。/

该方法返回模板。它在其方法签名中包含，以便模板可以将表单属性与 .showFormformPersonFormPersonForm

该方法接受两个参数：checkPersonInfo

标记为的对象，用于收集表单中填写的属性。personForm@Valid
一个对象，以便您可以测试和检索验证错误。bindingResult

您可以从绑定到对象的表单中检索所有属性。在代码中，测试错误。如果遇到错误，可以将用户发送回原始模板。在这种情况下，将显示所有错误属性。PersonFormform

如果此人的所有属性都有效，则会将浏览器重定向到最终模板。results

构建 HTML 前端

现在构建“主”页面，如以下列表（来自）所示：src/main/resources/templates/form.html

<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
    <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>

该页面包含一个简单的表单，其每个字段都位于表格的单独单元格中。该表单适合发布到。它被标记为由您在 Web 控制器的方法中看到的对象备份。这被称为“豆背形式”。Bean 中有两个字段，您可以看到它们被标记为和 .每个字段旁边都有一个辅助元素，用于显示任何验证错误。/personFormGETPersonFormth:field="*{name}"th:field="*{age}"

最后，您有一个提交表单的按钮。通常，如果用户输入的名称或年龄违反约束，它将反弹回此页面并显示错误消息。如果输入了有效的名称和年龄，则会将用户路由到下一个网页。@Valid

以下示例（来自）显示了结果页：src/main/resources/templates/results.html

<html>
  <body>
    Congratulations! You are old enough to sign up for this site.
  </body>
</html>

在这个简单的示例中，这些网页没有任何复杂的CSS或JavaScript。

运行应用程序

对于此应用程序，您使用的模板语言为百里香叶.此应用程序需要的不仅仅是原始 HTML。Spring 初始化器为您创建了一个应用程序类。以下清单（来自）显示了该类：src/main/java/com/example/validatingforminput/ValidatingFormInputApplication.java

package com.example.validatingforminput;

import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;

@SpringBootApplication
public class ValidatingFormInputApplication {

  public static void main(String[] args) throws Exception {
    SpringApplication.run(ValidatingFormInputApplication.class, args);
  }

}

要激活Spring MVC，您通常会添加到类中。但是 Spring Boot 在检测到您的类路径时已经添加了此注释。同样的注解允许它找到带批注的类及其方法。@EnableWebMvcApplication@SpringBootApplicationspring-webmvc@Controller

百里香叶配置也由负责。默认情况下，模板位于下的类路径中，并通过去除文件名中的“.html”后缀来解析为视图。（Thymeleaf 设置可以通过多种方式更改和覆盖，具体取决于您需要实现的目标，但详细信息与本指南无关。@SpringBootApplicationtemplates/

构建可执行的 JAR

您可以使用 Gradle 或 Maven 从命令行运行应用程序。您还可以构建一个包含所有必需依赖项、类和资源的可执行 JAR 文件并运行该文件。通过构建可执行 jar，可以轻松地在整个开发生命周期中跨不同环境等将服务作为应用程序进行交付、版本控制和部署。

如果使用 Gradle，则可以使用 .或者，您可以使用 JAR 文件生成 JAR 文件，然后运行该文件，如下所示：./gradlew bootRun./gradlew build

java -jar build/libs/gs-validating-form-input-0.1.0.jar

如果使用 Maven，则可以使用运行应用程序。或者，您可以使用 JAR 文件生成 JAR 文件，然后运行该文件，如下所示：./mvnw spring-boot:run./mvnw clean package

java -jar target/gs-validating-form-input-0.1.0.jar

此处描述的步骤将创建一个可运行的 JAR。你也可以构建经典 WAR 文件.

应用程序应在几秒钟内启动并运行。

如果您访问，您应该看到类似于下图的内容：http://localhost:8080/

应用程序应在几秒钟内启动并运行。

如果您访问，您应该看到类似于下图的内容：http://localhost:8080/

配置 Web 应用程序表单

以下一对图像显示了如果您输入姓名和年龄并单击“提交”会发生什么情况：N15

前面的图像显示，由于值违反了类中的约束，因此会退回到“主页”。请注意，如果单击“提交”，但输入框中没有任何内容，则会收到不同的错误，如下图所示：PersonForm

如果输入有效的姓名和年龄，则最终会出现在页面上，如下图所示：results

总结

祝贺！您已经编写了一个简单的 Web 应用程序，其中验证内置于域对象中。这样，您可以确保数据满足特定条件，并且用户正确输入数据。

秒客网

配置 Web 应用程序表单

您将构建什么

你需要什么

如何完成本指南

从 Spring 初始化开始

创建对象`PersonForm`

创建 Web 控制器

构建 HTML 前端

运行应用程序

构建可执行的 JAR

总结

相关文章

配置 Web 应用程序表单

您将构建什么

你需要什么

如何完成本指南

从 Spring 初始化开始

创建对象​​PersonForm​​

创建 Web 控制器

构建 HTML 前端

运行应用程序

构建可执行的 JAR

总结

相关文章

创建对象`PersonForm`