本此博客记录一套考试题，随后我把项目以及题目发到github上，简单的说一下springboot的开发
本此考试题用Spring+SpringMVC+MyBatis+SpringBoot+MySQL+Druid+.yml配置文件+thymeleaf模板引擎
我会把大量源码放上来，以及整合需要的注意点，大家可以一会去github上下载观看
项目概览：
一，jar包，pom.xml中的配置
<?xml version="1.0" encoding="UTF-8"?>
<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>
<artifactId>z05springbootmyself_exam</artifactId>
<packaging>war</packaging>
<name>z05springbootmyself_exam Maven Webapp</name>
<!-- FIXME change it to the project's website -->
<url>http://www.example.com</url>
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>2.0.3.RELEASE</version>
<relativePath/> <!-- lookup parent from repository -->
</parent>
<properties>
<project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
<project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>
<java.version>1.8</java.version>
</properties>
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-logging</artifactId>
</dependency>
<!-- 核心依赖 -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<!-- 可以实现热部署，在IDEA上实现热部署还需一些额外的配置，请查阅资料 -->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-devtools</artifactId>
<optional>true</optional>
<scope>runtime</scope>
</dependency>
<!-- JDBC for mysql -->
<dependency>
<groupId>mysql</groupId>
<artifactId>mysql-connector-java</artifactId>
<scope>runtime</scope>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-test</artifactId>
<scope>test</scope>
</dependency>
<!-- mybatis -->
<!--mybatis-->
<!-- https://mvnrepository.com/artifact/org.mybatis.spring.boot/mybatis-spring-boot-starter -->
<dependency>
<groupId>org.mybatis.spring.boot</groupId>
<artifactId>mybatis-spring-boot-starter</artifactId>
<version>1.3.1</version>
</dependency>
<!--fastJson-->
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>fastjson</artifactId>
<version>1.2.12</version>
</dependency>
<!--druid-->
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>druid</artifactId>
<version>1.0.18</version>
</dependency>
<dependency>
<groupId>org.mybatis</groupId>
<artifactId>mybatis</artifactId>
<version>3.4.1</version>
</dependency>
<!--thymeleaf 新的模板引擎，比jsp要出色-->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
<!--jdbc-->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-jdbc</artifactId>
</dependency>
<!-- 分页插件 -->
<dependency>
<groupId>com.github.pagehelper</groupId>
<artifactId>pagehelper-spring-boot-starter</artifactId>
<version>1.2.3</version>
</dependency>
</dependencies>
<build>
<finalName>z05springbootmyself_exam</finalName>
<!--maven插件-->
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
</plugin>
</plugins>
<!--xml配置，此是为了将来整合Hibernate或者mybatis
默认没有需要配置
-->
<resources>
<resource>
<directory>src/main/java</directory>
<includes>
<include>**/*.properties</include>
<include>**/*.xml</include>
</includes>
</resource>
</resources>
</build>
</project>
注意点：如果自己工程不是通过官网骨架创建，自己粘的话，小心粘了俩个parent节点，他不会报错，但是在后续就不会下载jar包了
二，数据库脚本，我给一份
DROP TABLE IF EXISTS `air_quality_index`;
CREATE TABLE `air_quality_index` (
`id` int(11) NOT NULL AUTO_INCREMENT,
`district` varchar(255) NOT NULL,
`monitorTime` datetime NOT NULL ON UPDATE CURRENT_TIMESTAMP,
`pm10` int(255) NOT NULL,
`pm25` int(255) NOT NULL,
`monitoringStation` varchar(255) NOT NULL,
`createDate` datetime NOT NULL ON UPDATE CURRENT_TIMESTAMP,
PRIMARY KEY (`id`)
) ENGINE=InnoDB AUTO_INCREMENT=12 DEFAULT CHARSET=utf8;
-- ----------------------------
-- Records of air_quality_index
-- ----------------------------
INSERT INTO `air_quality_index` VALUES ('1', '西城区', '2018-05-22 09:34:05', '243', '176', '灵境胡同监测站', '2018-05-22 10:57:21');
INSERT INTO `air_quality_index` VALUES ('2', '东城区', '2018-05-22 09:34:05', '27', '33', '东四监测站', '2018-05-22 09:34:35');
INSERT INTO `air_quality_index` VALUES ('3', '海淀区', '2018-05-22 09:34:05', '21', '30', '航天桥监测站', '2018-05-22 09:34:35');
INSERT INTO `air_quality_index` VALUES ('4', '丰台区', '2018-05-22 09:34:05', '24333', '17', '七里庄监测站', '2018-05-22 10:55:20');
INSERT INTO `air_quality_index` VALUES ('5', '西城区', '2018-05-22 09:58:03', '100', '1', '北京某地', '2018-06-22 16:41:51');
INSERT INTO `air_quality_index` VALUES ('6', '东城区', '2018-05-22 09:58:03', '22', '22', '山东某地222333', '2018-05-22 10:54:36');
INSERT INTO `air_quality_index` VALUES ('7', '西城区', '2018-05-22 09:58:03', '22', '22', '天津某地', '2018-05-22 10:57:41');
INSERT INTO `air_quality_index` VALUES ('8', '西城区', '2018-05-22 09:58:03', '122', '232', '山东222', '2018-05-22 10:58:59');
INSERT INTO `air_quality_index` VALUES ('9', '0', '2018-05-22 09:58:03', '22', '22', '北京某地', '2018-05-22 11:26:42');
INSERT INTO `air_quality_index` VALUES ('10', '西城区', '2018-05-22 09:58:03', '22', '22', '天津某地', '2018-06-22 16:42:17');
INSERT INTO `air_quality_index` VALUES ('11', '西城区', '2018-05-22 09:58:03', '1', '22', '灵境胡同监测站', '2018-06-22 16:42:50');
三，application.yml的配置
server:
#端口号
port: 8080
spring:
#模板引擎
thymeleaf:
prefix: classpath:/templates/
mode: HTML5
cache: false
#阿里的druid
datasource:
name: test
url: jdbc:mysql:///exam_air
username: root
password:
type: com.alibaba.druid.pool.DruidDataSource
driver-class-name: com.mysql.jdbc.Driver
filters: stat
maxActive: 20
initialSize: 1
maxWait: 60000
minIdle: 1
timeBetweenEvictionRunsMillis: 60000
minEvictableIdleTimeMillis: 300000
validationQuery: select 'x'
testWhileIdle: true
testOnBorrow: false
testOnReturn: false
poolPreparedStatements: true
maxOpenPreparedStatements: 20
mybatis:
#映射的xml文件
mapper-locations: classpath:mapping/*.xml
#别名
type-aliases-package: com.happy.entity
注意点：他是一种新的模板，yml不可以使用制表符TAB，它通过空格表示层级关系，同样的节点反复出现会有问题
我在里面配置了tomcat的端口，druid的数据源，以及mybatis的部分配置
四，项目骨架预览
五，thymeleaf模板的创建，他是以.html后缀名结尾的文件
1.主页面：
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" th:href="@{/css/bootstrap.min.css}">
<!--引入js的时候切记 不需要加 springboot的默认文件名称-->
<script type="text/javascript" th:src="@{/js/jquery-1.8.3.min.js}"></script>
<script type="text/javascript" th:src="@{/js/jquery.pagination.js}"></script>
<script type="text/javascript" th:src="@{/js/bootstrap-modal.js}"></script>
<script type="text/javascript">
window.onload=function () {
$("tr:odd").css("background","pink");
}
</script>
<title>Title</title>
<style type="text/css">
table{
border-collapse: collapse;
}
</style>
</head>
<body>
<table width="70%" border="1" align="center" id="list">
<caption><h1 style="height: 50px;line-height5:0px;border: 1px">空气质量检测信息库</h1>
按区域查询 <select name="district" id="ourSelect">
<option value="0">不限</option>
<option value="西城区">西城区</option>
<option value="东城区">东城区</option>
<option value="海淀区">海淀区</option>
<option value="丰台区">丰台区</option>
</select>
<input type="button" onclick="myselect()" value="查找"/>
<a href="/goAddPage">添加空气质量信息</a>
</caption>
<thead>
<tr class="t_head">
<th>序号</th>
<th>区域</th>
<th>检测时间</th>
<th>PM10数据</th>
<th>PM2.5数据局</th>
<th>监测站</th>
</tr>
</thead>
<tbody id="list-content">
</tbody>
</table>
<div class="pagination" id="pagination"></div>
<div id="isOK"></div>
<script type="text/javascript">
$(function () {
$("#update").hide();
})
load(); //默认初始化
/*点击查询的触发事件*/
function load() {
$.ajax({
url: "/findAll",
type: "post",
success: function (data) {
//清空数据
$("#list-content").html('');
//追加数据
$.each(data, function (i, dom) {
//一个dom就是一个新闻对象
$("#list-content").append("<tr><td>"+ dom.id + "</td><td><a onclick='update("+dom.id+")'>"+dom.district+"</a>" + "</td><td>" + dom.monitorTime + "</td><td>" + dom.pm10 + "</td><td >" + dom.pm25 + "</td><td>"+
dom.monitoringStation+"</td></tr>");
});
$("tr:odd").css("background","pink");
}
});
};
function myselect() {
$.ajax({
url: "/selectByCondition",
type: "post",
data:{"district":$("#ourSelect").val()},
success: function (data) {
//清空数据
$("#list-content").html('');
//追加数据
$.each(data, function (i, dom) {
//一个dom就是一个新闻对象
$("#list-content").append("<tr><td>"+ dom.id + "</td><td><a onclick='update("+dom.id+")'>"+dom.district+"</a>" + "</td><td>" + dom.monitorTime + "</td><td>" + dom.pm10 + "</td><td >" + dom.pm25 + "</td><td>"+
dom.monitoringStation+"</td></tr>");
});
$("tr:odd").css("background","pink");
}
});
};
function update(id) {
$("#update").show();
$("#list").hide();
$.ajax({
url:'/goUpdatePage',
type:"post",
data:{"id":id},
success:function(data){
$("[name=id]").val(data.id);
$("[name=district]").val(data.district);
$("[name=monitorTime]").val(data.monitorTime);
$("[name=pm10]").val(data.pm10);
$("[name=pm25]").val(data.pm25);
$("[name=monitoringStation]").val(data.monitoringStation);
}
});
}
</script>
<center>
<div id="update">
<h2>空气质量信息维护页面</h2>
<form method="post" action="/updateAir">
<input type="hidden" name="id"/>
<p>监测区域: <select name="district">
<option value="0">不限</option>
<option value="西城区">西城区</option>
<option value="东城区">东城区</option>
<option value="海淀区">海淀区</option>
<option value="丰台区">丰台区</option>
</select></p>
<p>监测日期: <input type="text" name="monitorTime" /></p>
<p>PM10值: <input type="text" name="pm10" /></p>
<p>PM2.5值: <input type="text" name="pm25" /></p>
<p>监测站: <input type="text" name="monitoringStation"/></p>
<input type="submit" value="更新"/>
<input type="button" onclick="javascript:$('#list').show();$('#update').hide()" value="返回"/>
</form>
</div>
</center>
</body>
</html>
2.添加页面：
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script type="text/javascript" th:src="@{/js/jquery-1.8.3.min.js}"></script>
<style type="text/css">
#box{
30%;
margin: 0px auto;
}
</style>
<script type="text/javascript">
function checkInfo() {
var district=$("[name=district]").val();
var monitorTime=$("[name=monitorTime]").val();
var pm10temp=$("[name=pm10]").val();
var pm10=parseInt(pm10temp);
var pm25temp=$("[name=pm25]").val();
var pm25=parseInt(pm25temp);
var monitoringStation=$("[name=monitoringStation]").val();
if(monitorTime==""){
alert("检测时间不能为空");
return false;
}
if(pm10temp==""){
alert("pm10的值不能为空");
return false;
}
var reg=/^d+$/;
if(!reg.test(pm10)){
alert('pm10只能为正整数');
return false;
}
if(pm25temp==""){
alert("pm25不能为空");
return false;
}
if(monitoringStation==""){
alert("监测站不能为空");
return false;
}
if(district=="不限"){
alert("监测区域不能选择不限");
return false;
}
return true;
}
$(function () {
$("#form1").submit(function () {
return checkInfo();
});
});
</script>
</head>
<body>
<div id="box">
<h2>添加空气质量信息</h2>
<form id="form1" method="post" action="/addAir">
<p>监测区域: <select name="district">
<option value="不限">不限</option>
<option value="西城区">西城区</option>
<option value="东城区">东城区</option>
<option value="海淀区">海淀区</option>
<option value="丰台区">丰台区</option>
</select></p>
<p>监测日期: <input type="text"name="monitorTime"/></p>
<p>PM10值: <input type="text"name="pm10"/></p>
<p>PM2.5值: <input type="text"name="pm25"/></p>
<p>监测站: <input type="text"name="monitoringStation"/></p>
<input type="submit" value="提交"/>
</form>
</div>
<script type="text/javascript">
</script>
</body>
</html>
3.修改页面：
注意点：他是一种新的模板，与jsp写法有不同，展示数据的方式，引用js，css都不太一样，也不同与EL，JSTL，需要摸索
它的核心th
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
六，实体类
注意点：日期类型处理格式
@DateTimeFormat(pattern = "yyyy-MM-dd hh:mm:ss")
@JsonSerialize(using = JsonDateSerializer.class)
/*处理日期格式*/
private Date monitorTime;
七，工具类---就是处理日期格式的那个工具类
八，Dao层
1.接口：
注意：他是一个普通的接口，没有注解是因为我在别处配置了一道，在yml有配置，在启动的那个main方法上面也有一道配置
2.dao层的xml
注意：命名空间，别名
还有那个智能标签if test里面的写法
直接传的String类型他会报错，说没有getString的方法，所以用map往里传参数
假如test='address!=0'，他会报错，说不可以转换为数字，故写为test='address!="0"'即可
九，service层：
1.接口：
2.实现类：
注意点：和普通的SSM注解开发没有什么太大的区别，值得注意的是事务的运用，需要在main那边开启一道配置
十，controller层：
普普通通，做过SSM的发现，没什么不同
十一，SpringBoot核心启动类的配置
package cn.happy;
import org.mybatis.spring.annotation.MapperScan;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.transaction.annotation.EnableTransactionManagement;
@SpringBootApplication
//扫描mapper映射
@MapperScan("cn.happy.*")
/*开启事务*/
@EnableTransactionManagement
public class ExamApplication {
public static void main(String[] args) {
SpringApplication.run(ExamApplication.class, args);
}
}
注意点：开启事务和mybatis的扫描
十二，可以启动项目和调试了
注意：
我没仔细讲js，css，logback，logback就普通配置，无关紧要，css，js放在static下面即可，引入方式可以参考案例，我引用了一个bootstrap的js，这无关紧要，不影响，只需要jquery即可