使用Spring Boot获取并操作表单的值
使用Spring Boot获取并操作表单值。
(用中文)2015年10月31日的约塞米蒂公园。
我从创建Spring Boot项目的步骤开始,一直执行到获取和操作表单的值。
由于我对Java Web应用程序的开发并不熟悉,所以可能存在一些奇怪的地方。
在MacBook Air(MBA)的初始设置备忘录Part2中,JDK和IntelliJ IDEA已经安装完毕。
创建项目的草稿
- Gradle のインストール
brew install gradle
- IntelliJ IDEA で Gradle プロジェクトの作成
启动 IntelliJ IDEA -> 新建项目 -> Gradle -> 下一步 ->
GoupId: org.mygroup.webapp
ArtifactId: spring-boot-example1
Version: 0.0.1-SNAPSHOT
下一个 -> 下一个 -> 下一个 -> 完成
- build.gradle の編集
请用中文对以下内容进行修改。只需提供一个选项:
编辑如下
group 'org.mygroup.webapp'
version '0.0.1-SNAPSHOT'
buildscript {
ext {
springBootVersion = '1.2.7.RELEASE'
}
repositories {
mavenCentral()
}
dependencies {
classpath("org.springframework.boot:spring-boot-gradle-plugin:${springBootVersion}")
classpath('io.spring.gradle:dependency-management-plugin:0.5.2.RELEASE')
classpath('org.springframework:springloaded:1.2.1.RELEASE')
}
}
apply plugin: 'java'
apply plugin: 'idea'
apply plugin: 'spring-boot'
apply plugin: 'io.spring.dependency-management'
jar {
baseName = 'spring-boot-example1'
version = '0.0.1-SNAPSHOT'
}
repositories {
mavenCentral()
}
dependencies {
compile('org.springframework.boot:spring-boot-starter-web')
compile('org.springframework.boot:spring-boot-starter-thymeleaf')
testCompile('org.springframework.boot:spring-boot-starter-test')
}
task wrapper(type: Wrapper) {
gradleVersion = '2.8'
}
リポジトリのアップデートと、build.gradle のリフレッシュ
第一次使用时,根据IntelliJ IDEA的提示消息,我成功进行了仓库更新和build.gradle的刷新,同时为了以后随时能进行这些操作,我也查找了相关方法。
- リポジトリのアップデート
用 IntelliJ IDEA的菜单找到 “Preferences”(⌘,)
->选择 “Build, Execution, Development”
-> 选择 “Build Tools” -> “Maven” -> “Repositories”
->在”URL”中输入:http://repo1.maven.org/maven2
-> 点击 “更新”按钮
- build.gradle のリフレッシュ
点击位于IntelliJ IDEA窗口右侧中央附近的”Gradle图标”(如果不存在,则点击位于左下角的”窗口图标”)。
点击 “Gradle” 图标,会打开 Gradle 工具窗口。然后按下位于 Gradle 工具窗口左上角的水绿色刷新按钮。
- 雛形の作成
请访问 http://start.spring.io/
选择Gradle项目,Spring Boot 1.2.7版本
在表格中输入以下内容
Group: org.mygroup.webapp
Artifact: spring-boot-example1
点击“生成项目”按钮
解压下载的 zip 文件
将其中的 src 文件夹移动到使用 IntelliJ IDEA 创建的项目根目录下
项目的目录结构
spring-boot-example1
├── build.gradle
├── gradle
│ └── wrapper
│ ├── gradle-wrapper.jar
│ └── gradle-wrapper.properties
├── gradlew
├── gradlew.bat
├── settings.gradle
├── spring-boot-example1.iml
└── src
├── main
│ ├── java
│ │ └── org
│ │ └── mygroup
│ │ └── webapp
│ │ └── SpringBootExample1Application.java
│ └── resources
│ └── application.properties
└── test
└── java
└── org
└── mygroup
└── webapp
└── SpringBootExample1ApplicationTests.java
创建HTML文件
参考 Handling Form Submission, 创建一个能够接收并显示来自表单的值的网站。
index.html
在 `src/main/resources/templates` 目录下创建一个文件夹:
– 首先在该文件夹中创建一个名为 `index` 的 HTML 文件。
(`index.html` 的作用是将表单中输入的值进行提交)
<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title>Index</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<h1>Form</h1>
<form action="#" th:action="@{/result}" th:object="${indexForm}" 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=”@{/result}” 表示表单的操作为“/result”
th:object=”${indexForm}” 将表单的内容都存储在indexForm对象中
th:field=”*{id}” 表示indexForm对象的id字段
th:field=”*{content}” 表示indexForm对象的content字段
当点击提交按钮时,将调用映射到”/result”的方法。该方法可以接受indexForm对象作为参数。
result.html
接下来,在/src/main/resources/templates创建一个名为”result”的HTML文件(result.html的作用是显示表单中输入的值)。
<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title>Result</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
</head>
<body>
<h1>Result</h1>
<p th:text="'id: ' + ${indexForm.id}" />
<p th:text="'content: ' + ${indexForm.content}" />
<a href="/">Submit another message</a>
</body>
</html>
使用${indexForm.id}来获取传递来的indexForm对象的id字段
使用${indexForm.content}来获取传递来的indexForm对象的content字段
当点击Submit another message链接时,会调用映射到”/”的方法
创建一个Java类
SpringBootExample1Application.java
在org.mygroup.webapp包中,以下类已经自动生成。
这个类特别没有需要更改的地方。
package org.mygroup.webapp;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
@SpringBootApplication
public class SpringBootExample1Application {
public static void main(String[] args) {
SpringApplication.run(SpringBootExample1Application.class, args);
}
}
IndexFormController.java
在相同的org.mygroup.webapp包中创建一个名为IndexFormController的Java类。
无论是”/”还是”/index”,都会显示index.html,因此我们将两者都返回”index”。
对于将多个URL映射到一个HTML文件上,我觉得可能有更好的写法。
(2015.11.16 更新)
根据多个 Spring @RequestMapping 注解的说法,
如果使用 @RequestMapping(value={“/”, “/index”}) 就可以了。
package org.mygroup.webapp;
import org.mygroup.webapp.model.IndexForm;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
@Controller
public class IndexFormController {
@RequestMapping(value="/")
public String index1(Model model) {
model.addAttribute("indexForm", new IndexForm());
return "index";
}
@RequestMapping(value="/index")
public String index2(Model model) {
model.addAttribute("indexForm", new IndexForm());
return "index";
}
@RequestMapping(value="/result", method=RequestMethod.POST)
public String indexFormSubmit(@ModelAttribute IndexForm indexForm, Model model) {
if (indexForm.getId() == 1) {
indexForm.setContent("お前がナンバーワンだ!");
}
model.addAttribute("indexForm", indexForm);
return "result";
}
}
以 model.addAttribute(“indexForm”, new IndexForm()) 的形式,在打开 index.html 页面时,如果不将一个空实例设置为表单,则会出现错误。
Error during execution of processor 'org.thymeleaf.spring4.processor.attr.SpringInputGeneralFieldAttrProcessor' (index:10)
@RequestMapping(value=”/result”, method=RequestMethod.POST),当请求方法为POST且路径为”/result”时,映射到名为indexFormSubmit的方法。
使用@ModelAttribute IndexForm indexForm来提交表单,然后将表单的值作为indexForm实例来创建IndexForm对象。
IndexForm.java
创建一个名为 org.mygroup.webapp.model 的包,在其中创建名为 IndexForm 的 Java 类。该类用于存储从表单发送过来的 indexForm 的内容。
package org.mygroup.webapp.model;
public class IndexForm {
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;
}
}
Gradle的bootRun指令
使用IntelliJ IDEA的终端,执行gradle bootRun命令。
在任意的浏览器中连接到localhost:8080,进行网站的运行确认。
其他
可以在/src/main/resources/application.properties中进行端口更改和热部署配置。
server.port=8080
spring.thymeleaf.cache=false
在GitHub上发布
在 Mac Book Air (MBA) 的初始设置备忘录 Part2 中,
已经可以连接到 GitHub。
在GitHub上创建一个名为spring-boot-example1的仓库。-> 在项目根目录下使用vim .gitignore命令,进行如下编辑
.DS_Store
.gradle
.idea
build*
gradle*
*.iml
settings*
接下来,执行以下操作。
git init
git add .
git commit -m 'spring boot example1: handling form submission'
git remote add origin github:/username/spring-boot-example1.git
git push -u origin master