SSM整合

        最近学到了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也帮我们做好了

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值