最近学到了SSM框架,于是就根据之前自己写的javaweb的项目进行了一次更新,将之前简单的servlet和jsp技术使用SSM框架进行更新,这里进行总结
1.导入需要的依赖
<?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>
<groupId>org.example</groupId>
<artifactId>SSM-prac</artifactId>
<version>1.0-SNAPSHOT</version>
<properties>
<maven.compiler.source>8</maven.compiler.source>
<maven.compiler.target>8</maven.compiler.target>
</properties>
<dependencies>
<!--Junit-->
<dependency>
<groupId>junit</groupId>
<artifactId>junit</artifactId>
<version>4.12</version>
</dependency>
<!--数据库驱动-->
<dependency>
<groupId>mysql</groupId>
<artifactId>mysql-connector-java</artifactId>
<version>5.1.47</version>
</dependency>
<!-- 数据库连接池 -->
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>druid</artifactId>
<version>1.1.14</version>
</dependency>
<!--Servlet-->
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>javax.servlet-api</artifactId>
<version>4.0.1</version>
</dependency>
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>servlet-api</artifactId>
<version>2.5</version>
</dependency>
<!--Mybatis-->
<dependency>
<groupId>org.mybatis</groupId>
<artifactId>mybatis</artifactId>
<version>3.5.2</version>
</dependency>
<dependency>
<groupId>org.mybatis</groupId>
<artifactId>mybatis-spring</artifactId>
<version>2.0.2</version>
</dependency>
<!--Spring-->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-webmvc</artifactId>
<version>5.1.9.RELEASE</version>
</dependency>
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-jdbc</artifactId>
<version>5.1.9.RELEASE</version>
</dependency>
<!--lombok-->
<dependency>
<groupId>org.projectlombok</groupId>
<artifactId>lombok</artifactId>
<version>1.16.10</version>
</dependency>
<!--aop-->
<dependency>
<groupId>org.aspectj</groupId>
<artifactId>aspectjweaver</artifactId>
<version>1.8.13</version>
</dependency>
<!--日志-->
<dependency>
<groupId>log4j</groupId>
<artifactId>log4j</artifactId>
<version>1.2.17</version>
</dependency>
<!--json-->
<dependency>
<groupId>com.alibaba</groupId>
<artifactId>fastjson</artifactId>
<version>1.2.60</version>
</dependency>
<!--工具类-->
<dependency>
<groupId>cn.hutool</groupId>
<artifactId>hutool-all</artifactId>
<version>5.7.13</version>
</dependency>
<!--文件上传-->
<dependency>
<groupId>commons-fileupload</groupId>
<artifactId>commons-fileupload</artifactId>
<version>1.3.3</version>
</dependency>
</dependencies>
<!--防止读取不到配置文件-->
<build>
<resources>
<resource>
<directory>src/main/java</directory>
<includes>
<include>**/*.properties</include>
<include>**/*.xml</include>
</includes>
<filtering>false</filtering>
</resource>
<resource>
<directory>src/main/resources</directory>
<includes>
<include>**/*.properties</include>
<include>**/*.xml</include>
</includes>
<filtering>false</filtering>
</resource>
</resources>
</build>
</project>
2.spring和mybati的配置文件
1.spring-mybatis持久层整合mybatis(还没有整合事务)
<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:context="http://www.springframework.org/schema/context"
xsi:schemaLocation="http://www.springframework.org/schema/beans
http://www.springframework.org/schema/beans/spring-beans.xsd
http://www.springframework.org/schema/context
https://www.springframework.org/schema/context/spring-context.xsd">
<context:property-placeholder location="classpath:db.properties"/>
<bean class="com.alibaba.druid.pool.DruidDataSource" id="dataSource">
<property name="driverClassName" value="${jdbc.driver}"/>
<property name="password" value="${jdbc.password}"/>
<property name="username" value="${jdbc.username}"/>
<property name="url" value="${jdbc.url}"/>
</bean>
<bean class="org.mybatis.spring.SqlSessionFactoryBean" id="sqlSessionFactory">
<property name="dataSource" ref="dataSource"/>
<property name="configuration">
<bean class="org.apache.ibatis.session.Configuration">
<property name="logImpl" value="org.apache.ibatis.logging.log4j.Log4jImpl"/>
<property name="mapUnderscoreToCamelCase" value="true"/>
</bean>
</property>
<property name="mapperLocations" value="classpath:com/wb/mapper/*.xml"/>
</bean>
<bean class="org.mybatis.spring.mapper.MapperScannerConfigurer">
<property name="sqlSessionFactoryBeanName" value="sqlSessionFactory"/>
<property name="basePackage" value="com.wb.dao"/>
</bean>
</beans>
2.spring-mvc service层
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:mvc="http://www.springframework.org/schema/mvc"
xmlns:context="http://www.springframework.org/schema/context"
xmlns:aop="http://www.springframework.org/schema/aop" xmlns:tx="http://www.springframework.org/schema/tx"
xsi:schemaLocation="http://www.springframework.org/schema/beans
http://www.springframework.org/schema/beans/spring-beans-3.2.xsd
http://www.springframework.org/schema/mvc
http://www.springframework.org/schema/mvc/spring-mvc-3.2.xsd
http://www.springframework.org/schema/context
http://www.springframework.org/schema/context/spring-context-3.2.xsd
http://www.springframework.org/schema/aop
http://www.springframework.org/schema/aop/spring-aop-3.2.xsd
http://www.springframework.org/schema/tx
http://www.springframework.org/schema/tx/spring-tx-3.2.xsd ">
<!-- 1,注解的驱动-->
<mvc:annotation-driven/>
<!-- 2,静态资源过滤-->
<mvc:default-servlet-handler/>
<!-- 3,扫描包-->
<context:component-scan base-package="com.wb"/>
<!-- 4,视图解析器-->
<bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<property name="prefix" value="/WEB-INF/pages/"/>
<property name="suffix" value=".html"/>
</bean>
<bean class="org.springframework.web.multipart.commons.CommonsMultipartResolver" id="multipartResolver">
<property name="defaultEncoding" value="UTF-8"/>
</bean>
</beans>
3.总配置文件applicationContext
<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:context="http://www.springframework.org/schema/context"
xmlns:aop="http://www.springframework.org/schema/aop" xmlns:tx="http://www.springframework.org/schema/tx"
xsi:schemaLocation="http://www.springframework.org/schema/beans
http://www.springframework.org/schema/beans/spring-beans.xsd
http://www.springframework.org/schema/context
http://www.springframework.org/schema/context/spring-context.xsd
http://www.springframework.org/schema/aop
https://www.springframework.org/schema/aop/spring-aop.xsd
http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx.xsd">
<import resource="spring-mvc.xml"/>
<import resource="spring-mybatis.xml"/>
</beans>
4.数据库连接配置db.properties
jdbc.driver=com.mysql.jdbc.Driver
jdbc.url=jdbc:mysql://localhost:3306/test
jdbc.username=root
jdbc.password=123456
5.log4j日志文件
#将等级为DEBUG的日志信息输出到console和file这两个目的地,console和file的定义在下面的代码
log4j.rootLogger=DEBUG,console,file
#控制台输出的相关设置
log4j.appender.console=org.apache.log4j.ConsoleAppender
log4j.appender.console.Target=System.out
log4j.appender.console.Threshold=DEBUG
log4j.appender.console.layout=org.apache.log4j.PatternLayout
log4j.appender.console.layout.ConversionPattern=[%c]-%m%n
#文件输出的相关设置
log4j.appender.file=org.apache.log4j.RollingFileAppender
log4j.appender.file.File=./log/test.log
log4j.appender.file.MaxFileSize=10mb
log4j.appender.file.Threshold=DEBUG
log4j.appender.file.layout=org.apache.log4j.PatternLayout
log4j.appender.file.layout.ConversionPattern=[%p][%d{yy-MM-dd}][%c]%m%n
#日志输出级别
log4j.logger.org.mybatis=DEBUG
log4j.logger.java.sql=DEBUG
log4j.logger.java.sql.Statement=DEBUG
log4j.logger.java.sql.ResultSet=DEBUG
log4j.logger.java.sq1.PreparedStatement=DEBUG
3.pojo
package com.wb.pojo;
import java.io.Serializable;
import lombok.Data;
/**
* car
* @author
*/
@Data
public class Car implements Serializable {
private Integer carId;
private String carName;
private String carImage;
private String carColor;
private static final long serialVersionUID = 1L;
}
4.dao
package com.wb.dao;
import com.wb.pojo.Car;
import java.util.List;
public interface CarDao {
int deleteByPrimaryKey(Integer carid);
boolean insert(Car record);
int insertSelective(Car record);
Car selectByPrimaryKey(Integer carid);
int updateByPrimaryKeySelective(Car record);
int updateByPrimaryKey(Car record);
List<Car> selectAllCar();
}
5.controller
package com.wb.controller;
import com.alibaba.fastjson.JSON;
import com.wb.model.ServiceModel;
import com.wb.pojo.Car;
import com.wb.service.CarService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.multipart.commons.CommonsMultipartFile;
import javax.servlet.http.HttpServletRequest;
import java.io.File;
import java.io.FileOutputStream;
import java.io.IOException;
import java.io.InputStream;
import java.util.List;
@Controller
@RequestMapping("/Car")
public class CarController {
@Autowired
private CarService service;
private ServiceModel model;
@RequestMapping("/toAddCar")
public String toAddCar() {
return "addCar";
}
//文件上传
@ResponseBody
@RequestMapping(value = "/uploadCar", produces = "text/html;charset=utf-8")
public String uploadCar(@RequestParam("file") CommonsMultipartFile file, HttpServletRequest request) throws IOException {
//获取文件的名称
String fileName = file.getOriginalFilename();
//文件保存的地方
String realPath = request.getServletContext().getRealPath("/upload");
File fileStore = new File(realPath);
if (!fileStore.exists()) {
fileStore.mkdir();
}
//去除后缀的汽车照片名称
String fileNameStore = fileName.substring(0, fileName.lastIndexOf("."));
System.out.println("fileName = " + fileName);
System.out.println("文件保存的地址" + fileStore.getPath());
InputStream inputStream = file.getInputStream();
FileOutputStream fileOutputStream = new FileOutputStream(new File(fileStore, fileName));
//读取写出
int len = 0;
byte[] buffer = new byte[1024];
while ((len = inputStream.read(buffer)) != -1) {
fileOutputStream.write(buffer, 0, len);
fileOutputStream.flush();
}
fileOutputStream.close();
inputStream.close();
return JSON.toJSONString(new ServiceModel(0, "上传完毕", 1, null));
}
@ResponseBody
@RequestMapping(value = "/addCar", produces = "text/html;charset=utf-8")
public String addCar(Car car) {
boolean flag = service.addCar(car);
if (flag) {
model = new ServiceModel(0, "添加成功", 1, car);
} else {
model = new ServiceModel(1, "添加失败", 0, null);
}
return JSON.toJSONString(model);
}
@RequestMapping("toCarList")
public String toCarList() {
return "carlist";
}
@ResponseBody
@RequestMapping(value = "/carList", produces = "text/html;charset=utf-8")
public String carList() {
List<Car> carList = service.carList();
model = new ServiceModel(0, "所有车辆信息", carList.size(), carList);
return JSON.toJSONString(model);
}
}
6.service接口
package com.wb.service;
import com.wb.pojo.Car;
import java.util.List;
public interface CarService {
List<Car> carList();
boolean addCar(Car car);
}
7.service实现类
package com.wb.service.Impl;
import com.wb.dao.CarDao;
import com.wb.pojo.Car;
import com.wb.service.CarService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import java.util.List;
@Service
public class CarServiceImpl implements CarService {
@Autowired
private CarDao carDao;
@Override
public List<Car> carList() {
return carDao.selectAllCar();
}
@Override
public boolean addCar(Car car) {
return carDao.insert(car);
}
}
7.前端页面
carlist.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>雇员列表</title>
<link href="../asserts/layui/css/layui.css" rel="stylesheet">
</head>
<body>
<h1>汽车列表</h1>
<button id="btn" class="layui-btn layui-btn-normal">点击查看</button>
<table class="layui-hide" id="currentTableId" lay-filter="currentTableFilter"></table>
<script type="text/html" id="toolbarDemo">
<div class="layui-btn-container">
<button class="layui-btn layui-btn-sm layui-btn-normal" lay-event="addInfo">添加信息</button>
</div>
</script>
<script type="text/html" id="barDemo">
<a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>
<script src="../asserts/jquery-3.2.1.js"></script>
<script src="../asserts/layui/layui.js"></script>
<script>$("#btn").on('click', function () {
$.ajax({
url: "/empList",
type: "post",
dataType: "json",
success: function (respData) {
layui.use('table', function () {
var table = layui.table;
table.render({
elem: '#currentTableId'
, url: '/Car/carList'
, cellMinWidth: 80 //全局定义常规单元格的最小宽度,layui 2.2.1 新增
, toolbar: '#toolbarDemo'
, cols: [[
{field: 'carId', title: '汽车Id', sort: true}
, {field: 'carName', title: '汽车名', sort: true}
, {
field: 'carImage',
width: 100,
title: '汽车照片',
templet: function (d) {
return '<div onclick="show_img(this)" ><img src="../..' + d.carImage + '" alt="" width="50px" height="50px"></a></div>';
}
}
, {field: 'carColor', title: '汽车颜色', sort: true}
, {fixed: 'right', title: '操作', toolbar: "#barDemo", width: 150}
]]
, limits: [10, 20, 40, 55, 70, 85],
limit: 10,
page: {
theme: '#1e9fff',
curr: 1,
}
, parseData(res) {
let result;
result = res.data.slice(this.limit * (this.page.curr - 1), this.limit * this.page.curr);
return {
"code": res.code, //解析接口状态
"msg": res.msg, //解析提示文本
"count": res.count, //解析数据长度
"data": result //解析数据列表
}
}
});
//图片弹出
window.show_img = function (t) {
t = $(t).find("img");
//页面层
layer.open({
type: 1,
title: false,
closeBtn: 0,
area: ['auto'],
skin: 'layui-layer-nobg', //没有背景色
shadeClose: true,
content: '<div style="text-align:center"><img src="' + $(t).attr('src') + '" alt="照片" width="450px" height="350px"/></div>'
});
}
//工具栏事件
table.on('toolbar(currentTableFilter)', function (obj) {
if (obj.event === 'addInfo') {
layer.open({
type: 2,
title: '添加汽车信息',
shade: 0.2,
maxmin: true,
shadeClose: true,
area: ['100%', '100%'],
content: "/Car/toAddCar"
})
}
});
});
}
})
});
</script>
</body>
</html>
addCar.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>添加汽车信息</title>
<link href="../asserts/layui/css/layui.css" rel="stylesheet">
</head>
<body>
<div class="layui-form">
<div class="layui-form-item">
<label class="layui-form-label required">汽车名称</label>
<div class="layui-input-block">
<input type="text" name="carName" lay-verify="required" lay-reqtext="汽车名称不能为空" placeholder="请输入汽车名称"
value=""
class="layui-input" id="carName">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label required">车辆颜色</label>
<div class="layui-input-block">
<input type="text" name="carColor" lay-verify="required" lay-reqtext="车辆颜色不能为空" placeholder="请输入车辆颜色"
value="" class="layui-input" id="carColor">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label required">车辆照片</label>
<div class="layui-input-block">
<button type="button" class="layui-btn" id="uploadCar" value="">上传图片</button>
<div class="layui-upload-list">
<img class="layui-upload-img" id="carImg" width="280px" height="200px">
</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-input-block">
<button class="layui-btn layui-btn-normal" lay-submit lay-filter="saveBtn" id="save">确认保存</button>
</div>
</div>
</div>
<script src="../asserts/layui/layui.js"></script>
<script>
layui.use(['form', 'upload'], function () {
var form = layui.form,
layer = layui.layer,
$ = layui.$,
upload = layui.upload;
//选完文件后不自动上传
var uploadFile = upload.render({
elem: '#uploadCar'
, url: '/Car/uploadCar' //此处用的是第三方的 http 请求演示,实际使用时改成您自己的上传接口即可。
, auto: false//自动上传关闭
, bindAction: "#save"//让上传事件与表单的提交按钮绑定
, choose: function (obj) {
//上传之前预览
obj.preview(function (index, file, result) {
$('#carImg').attr('src', result); //图片链接(base64)
});
}
, before: function (obj) {
layer.load(); //上传loading
}
, done: function (res, index, upload) {
layer.closeAll('loading'); //关闭loading
}
, error: function (index, upload) {
layer.alert('上传失败!' + index);
}
});
//监听提交
form.on('submit(saveBtn)', function (data) {
console.log(data.field);
let carImage = "/upload/" + data.field.file.substr(data.field.file.lastIndexOf("\\") + 1);
let carInfo = {carName: data.field.carName, carColor: data.field.carColor, carImage: carImage};
$.ajax({
data: carInfo
, url: "/Car/addCar"
, dataType: "json"
, type: "post"
, success: function (respData) {
if (respData.code === 0) {
var index = layer.alert(respData.msg, {icon: 1}, function () {
var iframeIndex = parent.layer.getFrameIndex(window.name);
parent.layer.close(iframeIndex);
parent.layui.table.reload('currentTableId');
});
} else {
index = layer.alert(respData.msg, {icon: 2}, function () {
layer.close(index);
});
}
}
})
return false;
});
});
</script>
</body>
</html>
剩下的删除跟编辑比较简单,未实现,自己也是知道了SSM框架的优势,可以大大简化开发的流程,让程序员只关注业务层就行了,对象的注入,页面的跳转spring和springmvc都已经帮我们做了,对于持久层,我们只需要关注sql语句就行了,这些mybatis也帮我们做好了