1.整合 jsp
步骤
1)创建springboot项目
2) 增加jsp依赖,jstl依赖,springboot内嵌的tomcat是没有jsp依赖的
<!--添加jsp引擎 springboot内嵌的tomcat没有jsp-->
<dependency>
<groupId>org.apache.tomcat.embed</groupId>
<artifactId>tomcat-embed-jasper</artifactId>
</dependency>
<!--添加jstl坐标依赖-->
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>jstl</artifactId>
</dependency>
-
创建webapp目录(与resource同级)在项目结构中Module里面将webapp设置为根目录
-
创建jsp
<%--
Created by IntelliJ IDEA.
User: HP
Date: 2021/3/22
Time: 19:27
To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>Title</title>
</head>
<body>
北京尚学堂
</body>
</html>
5) 创建控制器(不能直接访问WEB-INF中的资源)
package com.bjsxt.springbootjsp;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RestController;
@Controller
public class PageController {
@GetMapping("/{page}")
public String showPage(@PathVariable String page){
return page;
}
}
6)配置视图解析器
spring.mvc.view.prefix=/WEB-INF/jsp/
spring.mvc.view.suffix=.jsp
注意
视图解析器中的前缀最后面的/不能丢,否则会报错404
运行结果
如果在 IDEA 中项目结构为聚合工程。那么在运行 jsp 是需要指定路径。如果项目结构 为独立项目则不需要。
实践:将/去掉
spring.mvc.view.prefix=/WEB-INF/jsp
spring.mvc.view.suffix=.jsp
运行结果
2.整合 freemarker
步骤
- 创建springboot项目
2)pom.xml增加freemarker启动器
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-freemarker</artifactId>
</dependency>
3)创建实体类Users,创建页面跳转控制器UsersController,创建动态页面userList.ftl
package com.bjsxt.springbootfreemarker.pojo;
public class Users {
private String username;
private String usersex;
private String userage;
public String getUsername() {
return username;
}
public void setUsername(String username) {
this.username = username;
}
public String getUsersex() {
return usersex;
}
public void setUsersex(String usersex) {
this.usersex = usersex;
}
public String getUserage() {
return userage;
}
public void setUserage(String userage) {
this.userage = userage;
}
public Users(String username, String usersex, String userage) {
this.username = username;
this.usersex = usersex;
this.userage = userage;
}
}
package com.bjsxt.springbootfreemarker.controller;
import com.bjsxt.springbootfreemarker.pojo.Users;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import java.util.ArrayList;
import java.util.List;
@Controller
public class UsersController {
@GetMapping("/showUsers")
public String showUsers(Model model){
List<Users> list=new ArrayList<>();
list.add(new Users("admin","F","23"));
list.add(new Users("waa","M","23"));
list.add(new Users("wmm","F","23"));
model.addAttribute("list",list);
return "userList";
}
}
<#list list as user>是freemarker中的for循环。list与model中设置的名字一样。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Title</title>
</head>
<body>
<table border="1" align="center" width="50%">
<tr>
<th>Name</th>
<th>Age</th>
<th>Sex</th>
</tr>
<#list list as user>
<tr>
<td>${user.username}</td>
<td>${user.usersex}</td>
<td>${user.userage}</td>
</tr>
</#list>
</table>
</body>
</html>
- 配置freemarker后缀是.ftl
注意
如果没有增加test启动器会编译失败,找不到org.junit…
如果不配置后缀.ftl,会报错404
运行结果
3.整合 thymeleaf
步骤
1)创建springboot项目
2) 增加thymeleaf启动器
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
- 创建控制器,创建html(增加thymeleaf命名空间以及输出字符串到标签内容)
package com.bjsxt.springbootthymeleaf.controller;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
@Controller
public class PageController {
@GetMapping("/show")
public String showPage(Model model){
model.addAttribute("msg","hello thymeleaf");
return "index";
}
}
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title>北京尚学堂首页</title>
</head>
<body>
<span th:text="北京尚学堂"></span>
<hr/>
<span th:text="${msg}"></span>
</body>
</html>
注意
文件仍然是.html文件,只是动态页面增加了thymeleaf命名空间以及输出语法 th:text="",常量或者变量。
变量使用jstl表达式,仍然适用。
运行结果
附加:
Thymeleaf语法讲解
index.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns:th="http://www.thymeleaf.org">
<head >
<title>Title</title>
</head>
<body>
<hr/>
1. 变量输出<br/>
th:text<br/>
<span th:text="hello"></span>
<span th:text="${msg}"></span>
<hr/>
th:value<br/>
<input th:value="请输入身份证号..."></input><br/>
<hr/>
2. 内置对象<br/>
1) 字符串<br/>
<span th:text="${msg}"></span><br/>
<span th:text="${#strings.isEmpty(null)}"></span><br/>
<span th:text="${#strings.contains(msg,'t')}"></span><br/>
<span th:text="${#strings.startsWith(msg,'H')}"></span><br/>
<span th:text="${#strings.endsWith(msg,'f')}"></span><br/>
<span th:text="${#strings.length(msg)}"></span><br/>
<span th:text="${#strings.indexOf(msg,'H')}"></span><br/>
<span th:text="${#strings.indexOf(msg,'f')}"></span><br/>
<span th:text="${#strings.substring(msg,2)}"></span><br/>
<span th:text="${#strings.substring(msg,2,5)}"></span><br/>
<span th:text="${#strings.toUpperCase(msg)}"></span><br/>
<span th:text="${#strings.toLowerCase(msg)}"></span><br/>
<br/>
2) 日期对象<br/>
<span th:text="${#dates.format(date)}"></span><br/>
<span th:text="${#dates.format(date)}"></span><br/>
<span th:text="${#dates.year(date)}"></span><br/>
<span th:text="${#dates.month(date)}"></span><br/>
<span th:text="${#dates.day(date)}"></span><br/>
<br/>
<hr/>
3 条件判断(满足条件显示信息)<br/>
<span th:if="${sex}=='男'">
性别:男
</span>
<span th:if="${sex}=='女'">
性别:女
</span>
<br/>
<div th:switch="${id}">
<span th:case="1">ID为1</span>
<span th:case="2">ID为2</span>
<span th:case="3">ID为3</span>
<span th:case="*">ID为*</span>
</div><br/>
<hr/>
4 迭代遍历<br/>
<table border="1">
<tr>
<th>ID</th>
<th>NAME</th>
<th>AGE</th>
</tr>
<tr th:each="u : ${list}">
<td th:text="${u.id}"></td>
<td th:text="${u.name}"></td>
<td th:text="${u.age}"></td>
</tr>
</table>
<br/>
(注意 border是1加table上面)
<table border="1">
<tr>
<th>ID</th>
<th>NAME</th>
<th>AGE</th>
<th>KEY</th>
</tr>
<tr th:each="m : ${map}">
<td th:text="${m.value.id}"></td>
<td th:text="${m.value.name}"></td>
<td th:text="${m.value.age}"></td>
<td th:text="${m.key}"></td>
</tr>
</table>
<hr/>
5 操作域对象<br/>
<span th:text="${#httpServletRequest.getAttribute('req')}"></span><br/>
<span th:text="${#request.getAttribute('req')}"></span><br/>
<span th:text="${#session.getAttribute('ses')}"></span><br/>
<span th:text="${session.ses}"></span>(注意:没有#)<br/>
<span th:text="${application.app}"></span>(没有#)<br/>
<span th:text="${#servletContext.getAttribute('app')}"></span><br/>
<br/>
<hr/>
6 url表达式<br/>
<a th:href="@{http://www.baidu.com}">百度一下</a><br/>
<a th:href="@{/show}">springbootthymeleaf/show</a><br/>
普通url传参方式:<br/>
<a th:href="@{/show2?id=9&name=wmr}">springbootthymeleaf/show2 (?&拼接方式)</a><br/>
<a th:href="@{/show2(id=9,name=wmr)}">springbootthymeleaf/show2 (括號方式)</a><br/>
<a th:href="@{'/show2?id='+${user.id}+'&name='+${user.name}}">springbootthymeleaf/show2 (?&拼接方式,变量)</a><br/>
<a th:href="@{/show2(id=${user.id},name=${user.name})}">springbootthymeleaf/show2 (括號方式)</a><br/>
restful风格url传参方式:<br/>
<a th:href="@{/show3/{id}/{name}(id=${user.id},name=${user.name})}">springbootthymeleaf/show3 (restful方式,变量)</a><br/>
<a th:href="@{/show3/{id}/{name}(id=2,name=www)}">springbootthymeleaf/show3 (restful方式,常数)</a><br/>
</body>
</html>
index2.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns:th="http://www.thymeleaf.org">
<head >
<title>Title</title>
</head>
<body>
<span th:text="${id}"></span><br>
<span th:text="${name}"></span><br>
</body>
</html>
Users
package com.bjsxt.springbootthymeleaf.pojo;
public class Users {
private String id;
private String name;
private String age;
public Users(String id, String name, String age) {
this.id = id;
this.name = name;
this.age = age;
}
public String getId() {
return id;
}
public String getName() {
return name;
}
public String getAge() {
return age;
}
}
PageController
package com.bjsxt.springbootthymeleaf.controller;
import com.bjsxt.springbootthymeleaf.pojo.Users;
import com.sun.org.apache.regexp.internal.RE;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PathVariable;
import javax.servlet.http.HttpServletRequest;
import java.util.*;
@Controller
public class PageController {
@GetMapping("/show")
public String showPage(Model model,HttpServletRequest request){
model.addAttribute("msg","Hello thymeleaf");
model.addAttribute("date",new Date());
model.addAttribute("sex","男");
model.addAttribute("id","1");
List<Users> list=new ArrayList<>();
Users wmm = new Users("1", "wmm", "23");
Users zyb = new Users("2", "zyb", "30");
Users lhz = new Users("3", "lhz", "20");
model.addAttribute("list",list);
list.add(wmm);
list.add(zyb);
list.add(lhz);
Map<String,Users> map=new HashMap<>();
map.put("user1",wmm);
map.put("user2",zyb);
map.put("user3",lhz);
model.addAttribute("map",map);
// 设置
request.setAttribute("req","b");
request.getSession().setAttribute("ses","HttpSession");
request.getSession().getServletContext().setAttribute("app","Application");
model.addAttribute("user",zyb);
return "index";
}
@GetMapping("/show2")
public String showPage2(String id,String name,Model model){
System.out.println("id is "+id+" , name is "+name);
model.addAttribute("id",id);
model.addAttribute("name",name);
return "index2";
}
@GetMapping("/show3/{id}/{name}")
public String showPage3(@PathVariable String id,@PathVariable String name, Model model){
System.out.println("id is "+id+" , name is "+name);
model.addAttribute("id",id);
model.addAttribute("name",name);
return "index2";
}
}
运行结果
注意:
内置对象有时候是不加#的,如果加了会报错,比如:
session.ses前面就没有#
restful风格传参数与普通url拼接传参数可以同时使用