一,SpringBoot 整合 jsp 技術html
1,建立項目java
2,修改 pom 文件,添加座標mysql
<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> <parent> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-parent</artifactId> <version>1.5.10.RELEASE</version> </parent> <groupId>com.bjsxt</groupId> <artifactId>08-spring-boot-view-jsp</artifactId> <version>0.0.1-SNAPSHOT</version> <!-- jdk1.7 --> <properties> <java.version>1.7</java.version> </properties> <dependencies> <!-- springBoot 的啓動器 --> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> </dependency> <!-- jstl --> <dependency> <groupId>javax.servlet</groupId> <artifactId>jstl</artifactId> </dependency> <!-- jasper --> <dependency> <groupId>org.apache.tomcat.embed</groupId> <artifactId>tomcat-embed-jasper</artifactId> <scope>provided</scope> </dependency> </dependencies> </project>
3,建立 springBoot 的全局配置文件,application.propertiesweb
spring.mvc.view.prefix=/WEB-INF/jsp/
spring.mvc.view.suffix=.jsp
4,建立 Controllerspring
/** * SpringBoot 整合 jsp * * */ @Controller public class UserController { /* * 處理請求,產生數據 */ @RequestMapping("/showUser") public String showUser(Model model){ List<Users> list = new ArrayList<>(); list.add(new Users(1,"張三",20)); list.add(new Users(2,"李四",22)); list.add(new Users(3,"王五",24)); //須要一個 Model 對象 model.addAttribute("list", list); //跳轉視圖 return "userList"; } }
5,建立 jspsql
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> </head> <body> <table border="1" align="center" width="50%"> <tr> <th>ID</th> <th>Name</th> <th>Age</th> </tr> <c:forEach items="${list }" var="user"> <tr> <td>${user.userid }</td> <td>${user.username }</td> <td>${user.userage }</td> </tr> </c:forEach> </table> </body> </html>
6,建立啓動類數據庫
/** * SpringBoot 啓動類 * * */ @SpringBootApplication public class App { public static void main(String[] args) { SpringApplication.run(App.class, args); } }
二,SpringBoot 整合 Freemarkerapache
1,建立項目瀏覽器
2,修改 pom 添加座標tomcat
<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> <parent> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-parent</artifactId> <version>1.5.10.RELEASE</version> </parent> <groupId>com.bjsxt</groupId> <artifactId>09-spring-boot-view-freemarker</artifactId> <version>0.0.1-SNAPSHOT</version> <properties> <java.version>1.7</java.version> </properties> <dependencies> <!-- springBoot 的啓動器 --> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> </dependency> <!-- freemarker 啓動器的座標 --> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-freemarker</artifactId> </dependency> </dependencies> </project>
3,編寫視圖
注意: springBoot 要求模板形式的視圖層技術的文件必需要放到 src/main/resources 目錄下必 需要一個名稱爲 templates
<html> <head> <title>展現用戶數據</title> <meta charset="utf-9"></meta> </head> <body> <table border="1" align="center" width="50%"> <tr> <th>ID</th> <th>Name</th> <th>Age</th> </tr> <#list list as user > <tr> <td>${user.userid}</td> <td>${user.username}</td> <td>${user.userage}</td> </tr> </#list> </table> </body> </html>
4,建立 Controller
/** * SpringBoot 整合 jsp * * */ @Controller public class UserController { /* * 處理請求,產生數據 */ @RequestMapping("/showUser") public String showUser(Model model){ List<Users> list = new ArrayList<>(); list.add(new Users(1,"張三",20)); list.add(new Users(2,"李四",22)); list.add(new Users(3,"王五",24)); //須要一個 Model 對象 model.addAttribute("list", list); //跳轉視圖 return "userList"; } }
5,建立啓動器
/** * SpringBoot 啓動類 * * */ @SpringBootApplication public class App { public static void main(String[] args) { SpringApplication.run(App.class, args); } }
三,SpringBoot 整合 Thymeleaf (重點講解)
1.建立 Thymeleaf 的入門項目
1.1 建立項目
1.2修改 pom 文件添加座標
<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> <parent> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-parent</artifactId> <version>1.5.10.RELEASE</version> </parent> <groupId>com.bjsxt</groupId> <artifactId>10-spring-boot-view-thymeleaf</artifactId> <version>0.0.1-SNAPSHOT</version> <properties> <java.version>1.7</java.version> </properties> <dependencies> <!-- springBoot 的啓動器 --> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> </dependency> <!-- springBoot 的啓動器 --> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency> </dependencies> </project>
1.3建立存放視圖的目錄
目錄位置:src/main/resources/templates templates:該目錄是安全的。意味着該目錄下的內容是不容許外界直接訪問的。
2.Thymeleaf 的基本使用
2.1Thymeleaf特色:
Thymelaef 是經過他特定語法對 html 的標記作渲染。
2.2編寫 Controller
/** * Thymeleaf 入門案例 * * */ @Controller public class DemoController { @RequestMapping("/show") public String showInfo(Model model){ model.addAttribute("msg", "Thymeleaf 第一個案例"); return "index"; } }
2.3建立視圖 .html
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Thymeleaf 入門</title> </head> <body> <span th:text="Hello"></span> <hr/> <span th:text="${msg}"></span> </body> </html>
2.4編寫啓動類
/** * *Thymeleaf 入門案例 * */ @SpringBootApplication public class App { public static void main(String[] args) { SpringApplication.run(App.class, args); } }
2.5 解決異常
2.5.1 解決異常方式 1
讓 html 的標記按照嚴禁的語法去編寫。
2.5.2 解決異常方式 2
Thymeleaf.jar:更新爲 3.0 以上的版本 thymeleaf-layout-dialect.jar:更新爲 2.0 以上的版本
更換 thymeleaf 的 jar 包的版本
<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> <parent> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-parent</artifactId> <version>1.5.10.RELEASE</version> </parent> <groupId>com.bjsxt</groupId> <artifactId>10-spring-boot-view-thymeleaf</artifactId> <version>0.0.1-SNAPSHOT</version> <properties> <java.version>1.7</java.version> <thymeleaf.version>3.0.2.RELEASE</thymeleaf.version> <thymeleaf-layout-dialect.version>2.0.4</thymeleaf-layout-dialect.versi on> </properties> <dependencies> <!-- springBoot 的啓動器 --> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> </dependency> <!-- springBoot 的啓動器 --> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency> </dependencies> </project>
3.Thymeleaf 語法詳解
3.1變量輸出與字符串操做
3.1.1th:text
th:text 在頁面中輸出值
3.1.2th:value
th:value 能夠將一個值放入到 input 標籤的 value 中
3.1.3 判斷字符串是否爲空
Thymeleaf 內置對象 注意語法:
1,調用內置對象必定要用#
2,大部分的內置對象都以 s 結尾 strings、numbers、dates
${#strings.isEmpty(key)} 判斷字符串是否爲空,若是爲空返回 true,不然返回 false
${#strings.contains(msg,'T')} 判斷字符串是否包含指定的子串,若是包含返回 true,不然返回 false
${#strings.startsWith(msg,'a')} 判斷當前字符串是否以子串開頭,若是是返回 true,不然返回 false
${#strings.endsWith(msg,'a')} 判斷當前字符串是否以子串結尾,若是是返回 true,不然返回 false
${#strings.length(msg)}
返回字符串的長度
${#strings.indexOf(msg,'h')} 查找子串的位置,並返回該子串的下標,若是沒找到則返回-1
${#strings.substring(msg,13)} ${#strings.substring(msg,13,15)} 截取子串,用戶與 jdkString 類下 SubString 方法相同
${#strings.toUpperCase(msg)} ${#strings.toLowerCase(msg)}
字符串轉大小寫。
3.2日期格式化處理
${#dates.format(key)}
格式化日期,默認的以瀏覽器默認語言爲格式化標準
${#dates.format(key,'yyy/MM/dd')}
按照自定義的格式作日期轉換
${#dates.year(key)} ${#dates.month(key)} ${#dates.day(key)} year:取年 Month:取月 Day:取日
3.3條件判斷
3.3.1th:if
<span th:if="${sex} == ' 男 '"> 性別:男 </span> <span th:if="${sex} == ' 女 '"> 性別:女 </span>
3.3.2th:switch
<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> </div>
3.4迭代遍歷
3.4.1th:each
@RequestMapping("/show3") public String showInfo3(Model model){ List<Users> list = new ArrayList<>(); list.add(new Users(1,"張三",20)); list.add(new Users(2,"李四",22)); list.add(new Users(3,"王五",24)); model.addAttribute("list", list); return "index3"; }
<table border="1"> <tr> <th>ID</th> <th>Name</th> <th>Age</th> </tr> <tr th:each="u : ${list}"> <td th:text="${u.userid}"></td> <td th:text="${u.username}"></td> <td th:text="${u.userage}"></td> </tr> </table>
3.4.2ht:each 狀態變量
@RequestMapping("/show3") public String showInfo3(Model model){ List<Users> list = new ArrayList<>(); list.add(new Users(1,"張三",20)); list.add(new Users(2,"李四",22)); list.add(new Users(3,"王五",24)); model.addAttribute("list", list); return "index3"; }
<table border="1"> <tr> <th>ID</th> <th>Name</th> <th>Age</th> <th>Index</th> <th>Count</th> <th>Size</th> <th>Even</th> <th>Odd</th> <th>First</th> <th>lase</th> </tr> <tr th:each="u,var : ${list}"> <td th:text="${u.userid}"></td> <td th:text="${u.username}"></td> <td th:text="${u.userage}"></td> <td th:text="${var.index}"></td> <td th:text="${var.count}"></td> <td th:text="${var.size}"></td> <td th:text="${var.even}"></td> <td th:text="${var.odd}"></td> <td th:text="${var.first}"></td> <td th:text="${var.last}"></td> </tr> </table>
狀態變量屬性
1,index:當前迭代器的索引 從 0 開始
2,count:當前迭代對象的計數 從 1 開始
3,size:被迭代對象的長度
4,even/odd:布爾值,當前循環是不是偶數/奇數 從 0 開始
5,first:布爾值,當前循環的是不是第一條,若是是返回 true 不然返回 false
6,last:布爾值,當前循環的是不是最後一條,若是是則返回 true 不然返回 false
3.4.3th:each 迭代 Map
@RequestMapping("/show4") public String showInfo4(Model model){ Map<String, Users> map = new HashMap<>(); map.put("u1", new Users(1,"張三",20)); map.put("u2", new Users(2,"李四",22)); map.put("u3", new Users(3,"王五",24)); model.addAttribute("map", map); return "index4"; }
<table border="1"> <tr> <th>ID</th> <th>Name</th> <th>Age</th> </tr> <tr th:each="maps : ${map}"> <td th:text="${maps}"></td> </tr> </table> <th/> <table border="1"> <tr> <th>ID</th> <th>Name</th> <th>Age</th> </tr> <tr th:each="maps : ${map}"> <td th:each="entry:${maps}" th:text="${entry.value.userid}" ></td> <td th:each="entry:${maps}" th:text="${entry.value.username}"></td> <td th:each="entry:${maps}" th:text="${entry.value.userage}"></td> </tr> </table>
3.5域對象操做
3.5.1HttpServletRequest
request.setAttribute("req", "HttpServletRequest");
Request:<span th:text="${#httpServletRequest.getAttribute('req')}"></span><br/>
3.5.2HttpSession
request.getSession().setAttribute("sess", "HttpSession");
Session:<span th:text="${session.sess}"></span><br/>
3.5.3ServletContext
request.getSession().getServletContext().setAttribute("app", "Application");
Application:<span th:text="${application.app}"></span>
3.6URL 表達式
th:href th:src
3.6.1url 表達式語法
基本語法:@{}
3.6.2URL 類型
3.6.2.1絕對路徑 <a th:href="@{http://www.baidu.com}">絕對路徑</a><br/>
3.6.2.2 相對路徑
1)相對於當前項目的根 相對於項目的上下文的相對路徑 <a th:href="@{/show}">相對路徑</a>
2) 相對於服務器路徑的根 <a th:href="@{~/project2/resourcename}">相對於服務器的根</a>
3.6.3 在 url 中實現參數傳遞
<a th:href="@{/show(id=1,name=zhagnsan)}">相對路徑-傳參</a>
3.6.4 在 url 中經過 restful 風格進行參數傳遞
<a th:href="@{/path/{id}/show(id=1,name=zhagnsan)}"> 相 對 路 徑 - 傳 參 -restful</a>
SpringBoot 整合 SpringMVC+MyBatis
4、 建立項目
需求分析:經過使用 SpringBoot+SpringMVC+MyBatis 整合實現一 個對數據庫中的 users 表的 CRUD 的操做
1 修改 pom 文件
<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> <parent> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-parent</artifactId> <version>1.5.10.RELEASE</version> </parent> <groupId>com.bjsxt</groupId> <artifactId>12-spring-boot-springmvc-mybatis</artifactId> <version>0.0.1-SNAPSHOT</version> <properties> <java.version>1.7</java.version> <thymeleaf.version>3.0.2.RELEASE</thymeleaf.version> <thymeleaf-layout-dialect.version>2.0.4</thymeleaf-layout-dialect.ve rsion> </properties> <dependencies> <!-- springBoot 的啓動器 --> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> </dependency> <!-- web 啓動器 --> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency> <!-- Mybatis 啓動器 --> <dependency> <groupId>org.mybatis.spring.boot</groupId> <artifactId>mybatis-spring-boot-starter</artifactId> <version>1.1.1</version> </dependency> <!-- mysql 數據庫驅動 --> <dependency> <groupId>mysql</groupId> <artifactId>mysql-connector-java</artifactId> </dependency> <!-- druid 數據庫鏈接池 --> <dependency> <groupId>com.alibaba</groupId> <artifactId>druid</artifactId> <version>1.0.9</version> </dependency> </dependencies> </project>
2 添加 application.properties 全局配置文件
spring.datasource.driverClassName=com.mysql.jdbc.Driver spring.datasource.url=jdbc:mysql://localhost:3306/ssm spring.datasource.username=root spring.datasource.password=root spring.datasource.type=com.alibaba.druid.pool.DruidDataSource mybatis.type-aliases-package=com.bjsxt.pojo
3 數據庫表設計
CREATETABLE`users`( `id`int(11)NOTNULLAUTO_INCREMENT, `name`varchar(255)DEFAULTNULL, `age`int(11)DEFAULTNULL, PRIMARYKEY(`id`)
)ENGINE=InnoDBDEFAULTCHARSET=utf8;
5、 添加用戶
1 建立實體類
public class Users { private Integer id; private String name; private Integer age; public Integer getId() { return id; } public void setId(Integer id) { this.id = id; } public String getName() { return name; } public void setName(String name) { this.name = name; } public Integer getAge() { return age; } public void setAge(Integer age) { this.age = age; } }
2 建立 mapper 接口以及映射配置文件
import com.bjsxt.pojo.Users; public interface UsersMapper { void insertUser(Users users); } <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd"> <mapper namespace="com.bjsxt.mapper.UsersMapper"> <insert id="insertUser" parameterType="users"> insert into users(name,age) values(#{name},#{age}) </insert> </mapper>
3 建立業務層
@Service @Transactional public class UsersServiceImpl implements UsersService { @Autowired private UsersMapper usersMapper; @Override public void addUser(Users users) { this.usersMapper.insertUser(users); } }
4 建立 Controller
@Controller @RequestMapping("/users") public class UsersController { @Autowired private UsersService usersService; /** * 頁面跳轉 */ @RequestMapping("/{page}") public String showPage(@PathVariable String page){ return page; } /** * 添加用戶 */ @RequestMapping("/addUser") public String addUser(Users users){ this.usersService.addUser(users); return "ok"; } }
5 編寫頁面
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>添加用戶</title> </head> <body> <form th:action="@{/users/addUser}" method="post"> 用戶姓名:<input type="text" name="name"/><br/> 用戶年齡:<input type="text" name="age"/><br/> <input type="submit" value=" 確 定 "/><br/> </form> </body> </html> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>操做提示頁面</title> </head> <body> 操做成功!! ! </body> </html>
6 啓動類
@SpringBootApplication @MapperScan("com.bjsxt.mapper") //@MapperScan 用戶掃描MyBatis的Mapper接口 public class App { public static void main(String[] args) { SpringApplication.run(App.class, args); } }
6、 查詢用戶
1 在 mapper 接口中以及映射配置文件中添加相關代碼
List<Users> selectUsersAll();
<select id="selectUsersAll" resultType="users"> select id,name,age from users </select>
2 在業務層中添加查詢方法
@Override public List<Users> findUserAll() { return this.usersMapper.selectUsersAll(); }
3 在 Controller 中添加方法
/** * 查詢所有用戶 */ @RequestMapping("/findUserAll") public String findUserAll(Model model){ List<Users> list = this.usersService.findUserAll(); model.addAttribute("list", list); return "showUsers"; }
4 添加頁面
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>展現用戶數據</title> </head> <body> <table border="1" style="width:300px;"> <tr> <th>用戶 ID</th> <th>用戶姓名</th> <th>用戶年齡</th> </tr> <tr th:each="user : ${list}"> <td th:text="${user.id}"></td> <td th:text="${user.name}"></td> <td th:text="${user.age}"></td> </tr> </table> </body> </html>
7、 用戶更新
1 更新用戶以前的查詢,並將數據在頁面中回顯
1.1修改 mapper 接口以及映射配置文件
Users selectUsersById(Integer id); <select id="selectUsersById" resultType="users"> select id,name,age from users where id = #{value} </select>
1.2修改業務層代碼
@Override public Users findUserById(Integer id) { return this.usersMapper.selectUsersById(id); }
1.3修改 Controller
/** * 根據用戶 id 查詢用戶 */ @RequestMapping("/findUserById") public String findUserById(Integer id,Model model){ Users user = this.usersService.findUserById(id); model.addAttribute("user", user); return "updateUser"; }
1.4添加頁面 updateUsers.html
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> </head> <body> <form th:action="@{/users/editUser}" method="post"> <input type="hidden" name="id" th:field="${user.id}"/> 用戶姓名:<input type="text" name="name" th:field="${user.name}"/><br/> 用戶年齡:<input type="text" name="age" th:field="${user.age}"/><br/> <input type="submit" value=" 確 定 "/><br/> </form> </body> </html>
1.5修改 showUsers.html 頁面添加操做功能
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>展現用戶數據</title> </head> <body> <table border="1" style="width:300px;"> <tr> <th>用戶 ID</th> <th>用戶姓名</th> <th>用戶年齡</th> <th>操做</th> </tr> <tr th:each="user : ${list}"> <td th:text="${user.id}"></td> <td th:text="${user.name}"></td> <td th:text="${user.age}"></td> <td> <a th:href="@{/users/findUserById(id=${user.id})}">更 新用戶</a> </td> </tr> </table> </body> </html>
2 用戶更新
2.1修改 mapper 接口以及映射配置文件
void updateUser(Users users); <update id="updateUser" parameterType="users"> update users set name=#{name} ,age=#{age} where id=#{id} </update>
2.2修改業務層代碼
@Override public void updateUser(Users users) { this.usersMapper.updateUser(users); }
2.3修改 Controller
/** * 更新用戶 */ @RequestMapping("/editUser") public String editUser(Users users){ this.usersService.updateUser(users); return "ok"; }
8、 刪除用戶
1 修改 mapper 接口以及映射配置文件
void deleteUserById(Integer id); <delete id="deleteUserById"> delete from users where id = #{value} </delete>
2 修改業務層代碼
@Override public void deleteUserById(Integer id) { this.usersMapper.deleteUserById(id); }
3 修改 Controller
/** * 刪除用戶 */ @RequestMapping("/delUser") public String delUser(Integer id){ this.usersService.deleteUserById(id); return "redirect:/users/findUserAll"; }
4 修改 showUsers.html
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>展現用戶數據</title> </head> <body> <table border="1" style="width:300px;"> <tr> <th>用戶 ID</th> <th>用戶姓名</th> <th>用戶年齡</th> <th>操做</th> </tr> <tr th:each="user : ${list}"> <td th:text="${user.id}"></td> <td th:text="${user.name}"></td> <td th:text="${user.age}"></td> <td> <a th:href="@{/users/findUserById(id=${user.id})}">更 新用戶</a> <a th:href="@{/users/delUser(id=${user.id})}">刪除用戶 </a> </td> </tr> </table> </body> </html>