- Spring Boot是由Pivotal团队提供的全新框架,其设计目的是用来简化新Spring应用的初始搭建以及开发过程。该框架使用了特定的方式来进行配置,从而使开发人员不再需要定义样板化的配置。
- 新建一个maven工程,在pom.xml添加继承spring-boot-starter-parent和依赖spring-boot-starter-web,顺带添加热部署配置,也就是如下配置:
pom.xml(其中thymeleaf那个配置是使用themeleaf模板时引入的依赖,可以先不配)
<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/maven-v4_0_0.xsd">
<modelVersion>4.0.0</modelVersion>
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>1.5.14.RELEASE</version>
<relativePath />
</parent>
<groupId>com.bwf</groupId>
<artifactId>sbootdemo</artifactId>
<version>0.0.1-SNAPSHOT</version>
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
<version>1.5.9.RELEASE</version>
</dependency>
<dependency>
<!-- 配置热部署,就不用一改代码就要重新启动StartService了 -->
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-devtools</artifactId>
<optional>true</optional>
<scope>true</scope>
</dependency>
</dependencies>
</project>
目录结构:
3. 编写启动类(要加@SpringBootApplication),在控制台运行该类,启动SpringBoot
package com.bwf.main;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.context.annotation.ComponentScan;
@SpringBootApplication
@ComponentScan(basePackages={"com.bwf.controller"})
public class StartService {
public static void main(String[] args){
SpringApplication.run(StartService.class);
}
}
- 编写application.properties配置,编写Controller并测试,测试分三步:第一步,test1,无返回值,看是否能通过localhost:8090/sbootdemo/test1调用到该方法;第二步直接访问静态资源,新建一个static文件夹,在里面写一个index.html,看能否通过localhost:8090/sbootdemo/index.html访问到,不用加static路径,因为约定静态资源都放在该文件夹下(js,css,imgs),我的test2方法,在未配置thymeleaf模板前(它前缀后缀形式,实际上就是配了个视图解析器),可以不用redirect,直接写return “index.html”,就默认访问的是static里的index.html了;第三步,约定将动态资源放在templates文件夹下,写在它里面的html不属静态资源,而是thymeleaf模板,在此进行动态网页开发,配置thymeleaf后,如test3,返回index,就是请求test3时,访问的是templates里的index.html。
package com.bwf.controller;
import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Date;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import javax.servlet.http.HttpServletRequest;
import org.springframework.stereotype.Controller;
import org.springframework.ui.ModelMap;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;
import com.bwf.entity.User;
@Controller
public class UserController {
@RequestMapping("test1")
@ResponseBody
public void test1(){
System.out.println("你请求了test1");
}
@RequestMapping("test2")
public String test2(){
System.out.println("你请求了test2");
return "redirect:index.html";
}
@RequestMapping("test3")
public String test3(){
System.out.println("你请求了test3");
return "index";
}
@RequestMapping("test4")
public String test4(HttpServletRequest request,ModelMap mm){
System.out.println("你请求了test4");
request.setAttribute("name", "bwf");
request.setAttribute("url", "http://www.sohu.com");
request.setAttribute("img", "img/2.png");
request.setAttribute("data", 8888);
//上面那样写很麻烦,其实可以写一个ModelMap,它也可以自动提交属性到页面
mm.addAttribute("name2","bwf2");
User u = new User();
u.setId(1);
u.setName("张三");
mm.addAttribute("user", u);
Map<String,String> map = new HashMap();
map.put("k1", "v1");
map.put("k2", "v2");
map.put("k3", "v3");
mm.addAttribute("map", map);
String[] arr = {"hello","hi","nihao"};
mm.addAttribute("arr", arr);
User u2 = new User();
u2.setId(2);
u2.setName("李四");
User u3 = new User();
u3.setId(3);
u3.setName("王五");
List<User> list = new ArrayList<User>();
list.add(u);
list.add(u2);
list.add(u3);
mm.addAttribute("userList", list);
Date date1 = new Date();
String date2 = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss").format(new Date());
mm.addAttribute("date1", date1);
mm.addAttribute("date2", date2);
mm.addAttribute("pi",3.1415926);
mm.addAttribute("str","helloworld");
return "index";
}
}
application.xml
server.port=8090
server.context-path=/sbootdemo
#thymeleaf 模板
spring.thymeleaf.prefix=classpath:/templates/
spring.thymeleaf.suffix=.html
spring.thymeleaf.mode=HTML5
spring.thymeleaf.cache=false
spring.thymeleaf.encoding=UTF-8
spring.thymeleaf.content-type=text/html
上面的mode是HTML5而不是html5,严格区分大小写,而且templates里的页面必须严格遵从HTML5规范,一个标签未闭合都会访问报错
templates下的index.html
<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>Insert title here</title>
</head>
<body>
templates下的index.html<br/>
<!-- Thymeleaf模板基本的标签 -->
<!-- 1.th:text 替换标签内文本-->
<span th:text="${name}"></span><br/>
<span th:text="'hello:'+${name2}"></span>
<div th:inline="text">
<span>[[${name}]]</span>
</div>
<!-- 在javascript中可以直接获取页面属性了 -->
<script type="text/javascript" th:inline="text">
var name='[[${name}]]';
alert(name);
</script>
<script type="text/javascript" th:inline="javascript">
var name=[[${name}]];
alert(name);
</script>
<!-- 2.th:value 替换标签的value属性-->
<input value="original" th:value="${name}"/><br/>
<!-- 3.th:href 页面跳转替换 -->
<a href="http://www.baidu.com" th:href="${url}" th:text="${'搜狐'}">百度</a><br/>
<!-- 4.th:src 替换图片路径 -->
<img src="img/1.jpg" height="150px" th:src="${img}"/><br/>
<!-- 5.th:attr 支持多个属性,逗号隔开-->
<span th:text="我是span标签" th:attr="data=${data},data2=${data}"></span><br/>
<!-- 6.点或中括号访问属性对象,同EL表达式一样 -->
<span th:text="${user.id}"></span>
<span th:text="${user['name']}"></span><br/>
<!-- 7.th:object 对象标签,注意*号的用法(模板里有三个符号要注意$ * #) -->
<div th:object="${user}" th:inline="text">
<span>[[*{id}]]</span>
<span>[[*{name}]]</span>
</div>
<div th:object="${user}">
<span th:text="*{id}"></span>
<span th:text="*{name}"></span>
</div>
<div th:object="${map}">
<span th:text="*{k1}"></span>
<span th:text="*{k2}"></span>
<span th:text="*{k3}"></span>
</div>
<span th:text="${map[k1]}"></span><br/><!-- 注意上面的user对象就不能这样写了,map可以这样写 -->
<span th:text="${map['k1']}"></span><br/>
<span th:text="${map.k1}"></span><br/>
<span th:text="${arr[0]}"></span><br/>
<span th:text="${arr[1]}"></span><br/>
<span th:text="${arr[2]}"></span><br/><!-- 超过下标,控制台会报异常 -->
<span th:text="${userList[0].name}"></span><br/>
<span th:text="${userList[1].name}"></span><br/>
<span th:text="${userList[2].name}"></span><br/>
<!-- 接收参数 -->
<!--<span th:text="${param}"></span>
<span th:text="${param.p1[0]}"></span> 注意是这种访问方式
<span th:text="${param.p2[0]}"></span><br/>-->
<!-- thymeleaf模板中的内置对象 用# -->
<!-- dates对象 -->
<!-- 首先演示,controller传递过来的date对象,和格式化了的date对象效果 -->
<span th:text="${date1}"></span><br/>
<span th:text="${date2}"></span><br/>
<!-- dates对象,在前端就可以格式化日期 -->
<span th:text="${#dates.createNow()}"></span><br/>
<span th:text="${#dates.format(date1,'yyyy年MM月dd日 HH:mm:ss')}"></span><br/>
<span th:text="${#dates.format(#dates.createNow(),'yyyy年MM月dd日 HH:mm:ss')}"></span><br/>
<!-- numbers对象 -->
<span th:text="${pi}"></span><br/>
<span th:text="${#numbers.formatDecimal(pi,0,2)}"></span><br/>
<!-- 第一个数字为小数点左边数字位数,第二个数字为保留几位小数 -->
<!-- strings对象 -->
<span th:text="${#strings.length(str)}"></span><br/>
<span th:text="${#strings.isEmpty(str)}"></span><br/>
<span th:text="${#strings.startsWith(str,'h')}"></span><br/>
<span th:text="${#strings.equals(str,'helloworld')}"></span><br/>
<span th:text="${#strings.concat('hello','world')}"></span><br/>
<!-- th:if th:switch th:each -->
<!-- if -->
<span th:if="${param.pwd[0] eq '123'}">pwd参数为123我就显示(没有pwd参数,会报错)</span><br/>
<!-- 如果比较的是数值怎么写呢 ?-->
<span th:if="${param.no[0]}==123">no参数为123我就显示(写在大括号外面)</span><br/>
<span th:if="${param.number[0]} > 5">number参数大于5我就显示(可以用大于号,也可以用gt)</span><br/>
<span th:if="${param.number2[0]} lt 5">number2参数小于5我就显示(只能用lt)</span><br/>
<!-- switch -->
<div th:switch="${param.choice[0]}">
<span th:case="a">aaa</span>
<span th:case="b">bbb</span>
<span th:case="c">ccc</span>
<span th:case="*">都不匹配显示我</span>
</div>
<!-- each -->
<!-- 遍历数组 -->
<ul>
<li th:each="e:${arr}" th:text="${e}"></li>
</ul>
<!-- 遍历集合 -->
<table>
<thead>
<tr>
<th>是否是奇数行?</th>
<th>是否是偶数行?</th>
<th>是否是第一行?</th>
<th>是否是最后一行?</th>
<th>编号</th>
<th>用户id</th>
<th>姓名</th>
</tr>
</thead>
<tbody>
<!-- 注意这里可以获得两个参数,user和status,status里有index,count,size,current等属性 -->
<tr th:each="user,status:${userList}">
<td th:text="${status.even}"></td>
<td th:text="${status.odd}"></td>
<td th:text="${status.first}"></td>
<td th:text="${status.last}"></td>
<td th:text="${status.index}"></td>
<td th:text="${user.id}"></td>
<td th:text="${user.name}"></td>
</tr>
</tbody>
</table>
</body>
</html>
访问结果:
- 少演示了个东西,thymeleaf里的页面包含
<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>Insert title here</title>
</head>
<body>
templates下的index2.html<br/>
<!-- 演示thymeleaf里的包含,首先你将要包含的内容统一写在inc.html里 -->
<!-- 方式1:th:include 包含id标签里的文本内容-->
<span th:include="inc::#foot"></span>
<!-- 方式2:th:fragment 包含任意标签里的内容,不再是id,但要用th:fragment指定 -->
<span th:include="inc::haha"></span>
<!-- 方式3:th:replace 替换整个标签,整个替换 -->
<span th:replace="inc::#foot"></span> <!-- 将此处的span标签整个替换为foot所属的div -->
</body>
<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>这是标题标签内容</title>
</head>
<body>
templates下的inc.html<br/>
<!-- 方式1:th:include 包含id标签里的文本内容-->
<div id="foot">
版权所有
</div>
<!-- 方式2:th:fragment 包含任意标签片段 -->
<haha>hehe</haha>
<div th:fragment="haha"></div>
</body>
</html>