SSM整合、环境配置以及基础综合测试(单表查询、多表查询和数据分页、前后端分离、Vue3)
SSM整合、环境配置以及基础综合测试
准备：创建maven项目以及项目框架准备
SSM整合简介
介绍:
- SSM(Spring+SpringMVC+MyBatis) 整合，就是三个框架协同开发。
- Spring整合Mybatis就是将Mybatis核心配置文件当中数据源的配置、事务处理、以及工厂的配置，Mapper接口的实现类等交给Spring管理。即spring.xml
- Spring整合SpringMVC，就是在web.xml当中添加监听器 ，当服务启动，监听触发，监听器执行了Spring的核心配置文件，核心配置文件被加载。即springmvc.xml
整合核心步骤：
- Spring基础框架单独运行
- SpringMVC框架单独运行
- Spring整合SpringMVC框架
- Spring整合Mybatis框架
添加依赖和配置文件
<?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>com.etime</groupId><artifactId>day13</artifactId><version>1.0-SNAPSHOT</version><properties><project.build.sourceEncoding>UTF-8</project.build.sourceEncoding><maven.compiler.source>8</maven.compiler.source><maven.compiler.target>8</maven.compiler.target><spring-version>5.2.5.RELEASE</spring-version><mybatis-version>3.4.6</mybatis-version></properties><dependencies><!--mybatis相关包--><!--mysql的驱动包--><dependency><groupId>mysql</groupId><artifactId>mysql-connector-java</artifactId><version>8.0.11</version><scope>runtime</scope></dependency><!--mybatis核心--><dependency><groupId>org.mybatis</groupId><artifactId>mybatis</artifactId><version>${mybatis-version}</version></dependency><!--连接池--><dependency><groupId>com.mchange</groupId><artifactId>c3p0</artifactId><version>0.9.5.2</version></dependency><!--junit--><dependency><groupId>junit</groupId><artifactId>junit</artifactId><version>4.12</version><scope>test</scope></dependency><!--日志包--><dependency><groupId>log4j</groupId><artifactId>log4j</artifactId><version>1.2.17</version></dependency><!--分页插件--><dependency><groupId>com.github.pagehelper</groupId><artifactId>pagehelper</artifactId><version>5.1.10</version></dependency><!--spring相关的--><!--springIOC包--><dependency><groupId>org.springframework</groupId><artifactId>spring-context</artifactId><version>${spring-version}</version></dependency><!--jdbc--><dependency><groupId>org.springframework</groupId><artifactId>spring-jdbc</artifactId><version>${spring-version}</version></dependency><!--织入器包：--><dependency><groupId>org.aspectj</groupId><artifactId>aspectjweaver</artifactId><version>1.8.7</version></dependency><!--springmvc依赖：--><dependency><groupId>org.springframework</groupId><artifactId>spring-webmvc</artifactId><version>${spring-version}</version></dependency><!--解析器包--><dependency><groupId>com.fasterxml.jackson.core</groupId><artifactId>jackson-databind</artifactId><version>2.9.9</version></dependency><!--文件上传--><dependency><groupId>commons-fileupload</groupId><artifactId>commons-fileupload</artifactId><version>1.3.1</version></dependency><!--spring整合mybatis--><dependency><groupId>org.mybatis</groupId><artifactId>mybatis-spring</artifactId><version>1.3.2</version></dependency><!--spring整合junit--><dependency><groupId>org.springframework</groupId><artifactId>spring-test</artifactId><version>${spring-version}</version></dependency><dependency><groupId>org.projectlombok</groupId><artifactId>lombok</artifactId><version>1.18.16</version></dependency></dependencies></project>
jdbc.properties：与数据库建立连接的密码驱动等的属性配置文件
jdbc.driver=com.mysql.cj.jdbc.Driver
jdbc.url=jdbc:mysql://localhost:3306/db_418?useUnicode=true&characterEncoding=utf-8&useSSL=false&serverTimezone=UTC
jdbc.username=root
jdbc.password=h123456
spring.xml配置文件配置扫描包
<beans xmlns="http://www.springframework.org/schema/beans"xmlns:mvc="http://www.springframework.org/schema/mvc"xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xmlns:aop="http://www.springframework.org/schema/aop"xmlns:tx="http://www.springframework.org/schema/tx"xmlns:context="http://www.springframework.org/schema/context"xsi:schemaLocation="http://www.springframework.org/schema/beanshttp://www.springframework.org/schema/beans/spring-beans.xsdhttp://www.springframework.org/schema/mvchttp://www.springframework.org/schema/mvc/spring-mvc.xsdhttp://www.springframework.org/schema/txhttp://www.springframework.org/schema/tx/spring-tx.xsdhttp://www.springframework.org/schema/aophttp://www.springframework.org/schema/aop/spring-aop.xsdhttp://www.springframework.org/schema/contexthttp://www.springframework.org/schema/context/spring-context.xsd"><context:component-scan base-package="com.etime.service"></context:component-scan>
</beans>
新建实体类Student
package com.etime.pojo;import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;//注解注入无参构造函数
@NoArgsConstructor
//注解注入全参构造函数
@AllArgsConstructor
//注解注入get,set等方法
@Data
public class Student {private int sid;private String sname;private int cid;
}创建接口StudentService.java:查询所有学生信息
package com.etime.service;import com.etime.pojo.Student;import java.util.List;public interface StudentService {List<Student> getAllStudent();
}创建StudentService.java接口的实现类StudentServiceImpl.java并继承StudentService且实现里面的方法getAllStudent
package com.etime.service.impl;import com.etime.pojo.Student;
import com.etime.service.StudentService;
import org.springframework.stereotype.Service;import java.util.List;@Service
public class StudentServiceImpl implements StudentService {@Overridepublic List<Student> getAllStudent() {System.out.println("这是service实现类里面的方法");return null;}
}测试：测试通过spring的配置是否可行
package com.etime.test;import com.etime.service.StudentService;
import org.junit.Test;
import org.junit.runner.RunWith;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.test.context.ContextConfiguration;
import org.springframework.test.context.junit4.SpringJUnit4ClassRunner;//通过@RunWith注解的方式加载注入SpringJunit4ClalssRunner.class文件对spring进行测试
@RunWith(SpringJUnit4ClassRunner.class)
//通过注解@ContextConfiguration注解加载文件spring.xml
@ContextConfiguration("classpath:spring.xml")
public class SsmTest {//使用自动注入注解@Autowired对接口StudentService进行注入@Autowiredprivate StudentService studentService;//使用@Test单元注解的方式对实现层的方法调用@Testpublic void t01(){studentService.getAllStudent();}
}单独测试service结果是spring的单独测试下面将对它进行整合：如下的测试结果表名确实是通过spring.xml配置文件可以测试当前接口实现类里面的方法
在web.xml中配置核心控制器（DispatcherServlet）:通过web.xml中配置核心控制器控制加载springmvc的配置文件，加载web.xml同时也加载springmvc.xml文件
<!--配置前端控制器： -->
<!-- 将配置文件springmvc.xml文件整合到项目中当web.xml被加载的同时，springmvc.xml也同样被控制器内进行加载拿到配置文件内的内容--><servlet><servlet-name>DispatcherServlet</servlet-name><servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class><!--加载springmvc的配置文件：--><init-param><param-name>contextConfigLocation</param-name><param-value>classpath:springmvc.xml</param-value></init-param><!--设置加载时机： --><load-on-startup>1</load-on-startup></servlet><!-- 设置Servlet的映射路径--><servlet-mapping><servlet-name>DispatcherServlet</servlet-name><url-pattern>/</url-pattern></servlet-mapping>
创建springmvc核心配置文件：配置扫描控制层的处理文件，以及处理器，但是后期用了前后端分离的模式来讲解，所以其实，配置视图解析器的但是没有用到。
<beans xmlns="http://www.springframework.org/schema/beans"xmlns:mvc="http://www.springframework.org/schema/mvc"xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xmlns:aop="http://www.springframework.org/schema/aop"xmlns:tx="http://www.springframework.org/schema/tx"xmlns:context="http://www.springframework.org/schema/context"xsi:schemaLocation="http://www.springframework.org/schema/beanshttp://www.springframework.org/schema/beans/spring-beans.xsdhttp://www.springframework.org/schema/mvchttp://www.springframework.org/schema/mvc/spring-mvc.xsdhttp://www.springframework.org/schema/txhttp://www.springframework.org/schema/tx/spring-tx.xsdhttp://www.springframework.org/schema/aophttp://www.springframework.org/schema/aop/spring-aop.xsdhttp://www.springframework.org/schema/contexthttp://www.springframework.org/schema/context/spring-context.xsd"><!--配置注解扫描器-->
<!-- 目的是通过扫描器能找到控制层包下的所有文件，然后根据文件对其进行其它操作--><context:component-scan base-package="com.etime.controller"></context:component-scan><!--处理器配置--><mvc:annotation-driven></mvc:annotation-driven><!--配置视图解析器：--><bean class="org.springframework.web.servlet.view.InternalResourceViewResolver"><property name="prefix" value="/"/><property name="suffix" value=".jsp"/></bean>
</beans>
创建控制器整理数据，对数据进行简单处理
package com.etime.controller;import com.etime.pojo.Student;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;@Controller
@RequestMapping("/student")
public class StudentController {@RequestMapping("t02")@ResponseBodypublic Student test(){return new Student(1,"mchh",2);}
}这里测试工具我使用Apifox进行接口测试：如果想要使用该工具的，大家可以去该路径下我有写在哪可以下载，以及使用：
https://blog.csdn.net/m0_56245143/article/details/130270652?spm=1001.2014.3001.5501
运行结果：
整合Spring 和 SpringMVC:web.xml中添加监听器的方式当在加载的web.xml的时候就能将所需要加载的配置加载上，使用servletContext的监听器，是在该项目第一次被访问的时候就加载的，监听到的时候就 对该文件的其它配置进行加载
在web.xml中进行配置：
<context-param><param-name>contextConfigLocation</param-name><param-value>classpath:spring.xml</param-value></context-param><!--配置了一个监听器: ServletContext--><listener><listener-class>org.springframework.web.context.ContextLoaderListener</listener-class></listener>
修改service实现类方法代码及控制器代码并测试：准备一些简单测试数据对进行测试，因为目前所做的还是为了后面整合ssm做准备的。
在StudentServiceImpl.java中进行修改
package com.etime.service.impl;import com.etime.pojo.Student;
import com.etime.service.StudentService;
import org.springframework.stereotype.Service;import java.util.ArrayList;
import java.util.List;@Service
public class StudentServiceImpl implements StudentService {@Overridepublic List<Student> getAllStudent() {//准备多个学生数据信息进行测试Student student1= new Student(1,"cc",2);Student student2 = new Student(2,"mc",3);Student student3 = new Student(3,"mm",4);List<Student> list = new ArrayList<>();list.add(student1);list.add(student2);list.add(student3);return list;}
}对控制层也进行微量的调节，获取到service返回的数据
对StudentController.java进行修改：
package com.etime.controller;import com.etime.pojo.Student;
import com.etime.service.StudentService;
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.ResponseBody;import java.util.List;@Controller
@RequestMapping("/student")
public class StudentController {//本来如果没有用注解的情况下，如果要对service的数据进行访问时，就只能进行对StudentService类进行创建新对象//可以使用@Autowired注解的方式对service进行引入@Autowiredprivate StudentService studentService;@RequestMapping("t02")@ResponseBodypublic List<Student> test(){return studentService.getAllStudent();}
}运行结果：
该次测试将打通数据访问层将mybatis也整合进来：
编写数据访问层的接口
StudentMapper.java
package com.etime.mapper;import com.etime.pojo.Student;import java.util.List;public interface StudentMapper {List<Student> getAllStudent();
}编写mybatis映射配置文件：这里有两种方式，一种使用配置文件的方式，另一种方式就是使用纯注解的方式进行数据 访问层的操作。我这里采用的方式是直接使用配置文件的方式：
如图所示的创建StudentMappe.xml文件以及添加修改数据：
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapperPUBLIC "-//mybatis.org//DTD Mapper 3.0//EN""http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.etime.mapper.StudentMapper"><select id="getAllStudent" resultType="Student">select * from student</select>
</mapper>
将Spring和mybatis配置进行整合
准备连接数据的配置属性文件，注意根据个人即将测试的数据，修改该数据库的名称，密码和用户等
jdbc.driver=com.mysql.cj.jdbc.Driver
jdbc.url=jdbc:mysql://localhost:3306/db_418?useUnicode=true&characterEncoding=utf-8&useSSL=false&serverTimezone=UTC
jdbc.username=root
jdbc.password=h123456
在spring.xml中配置连接数据库，准备数据源
<beans xmlns="http://www.springframework.org/schema/beans"xmlns:mvc="http://www.springframework.org/schema/mvc"xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"xmlns:aop="http://www.springframework.org/schema/aop"xmlns:tx="http://www.springframework.org/schema/tx"xmlns:context="http://www.springframework.org/schema/context"xsi:schemaLocation="http://www.springframework.org/schema/beanshttp://www.springframework.org/schema/beans/spring-beans.xsdhttp://www.springframework.org/schema/mvchttp://www.springframework.org/schema/mvc/spring-mvc.xsdhttp://www.springframework.org/schema/txhttp://www.springframework.org/schema/tx/spring-tx.xsdhttp://www.springframework.org/schema/aophttp://www.springframework.org/schema/aop/spring-aop.xsdhttp://www.springframework.org/schema/contexthttp://www.springframework.org/schema/context/spring-context.xsd"><context:component-scan base-package="com.etime.service"></context:component-scan><bean class="org.mybatis.spring.mapper.MapperScannerConfigurer"><property name="basePackage" value="com.etime.mapper" /></bean><!--数据源--><context:property-placeholder location="classpath:jdbc.properties"/><bean id="dataSource" class="com.mchange.v2.c3p0.ComboPooledDataSource"><property name="driverClass" value="${jdbc.driver}"/><property name="jdbcUrl" value="${jdbc.url}"/><property name="user" value="${jdbc.username}"/><property name="password" value="${jdbc.password}"/></bean><!--mybatis的核心工厂对象--><bean id="sessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean"><!--注入数据源--><property name="dataSource" ref="dataSource"/><!--别名--><property name="typeAliasesPackage" value="com.etime.pojo"/><!--mapper 文件的位置--><property name="mapperLocations" value="classpath:com/etime/mapper/*.xml"/><!--配置分页插件--><property name="plugins"><array><bean class="com.github.pagehelper.PageInterceptor"><property name="properties"><value>helperDialect=mysqlreasonable=truesupportMethodsArguments=trueparams=count=countSqlautoRuntimeDialect=true</value></property></bean></array></property></bean>
</beans>
原本是需要对spring.xml中配置的事务进行处理的使用注解权限，但是这里用不到，配置上一方用到：
<!--事务管理器平台-->
<bean id="transactionManager" class="org.springframework.jdbc.datasource.DataSourceTransactionManager"><!--注入一个数据源--><property name="dataSource" ref="dataSource"/>
</bean><!--开启注解式事务-->
<tx:annotation-driven transaction-manager="transactionManager"></tx:annotation-driven>
修改service实现类中的方法
StudentServiceImpl.java
package com.etime.service.impl;import com.etime.mapper.StudentMapper;
import com.etime.pojo.Student;
import com.etime.service.StudentService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;import java.util.ArrayList;
import java.util.List;@Service
public class StudentServiceImpl implements StudentService {//使用@Autowired注解将StudentMapper接口引入@Autowiredprivate StudentMapper studentMapper;@Overridepublic List<Student> getAllStudent() {//准备多个学生数据信息进行测试return studentMapper.getAllStudent();}
}启动服务进行测试整合结果：如下图的结果说明还是比较成功的打通了ssm的所有整合过程
SSM整合测试
使用前后端分离的技术对整合的ssm进行测试：
案例一、使用VScode、idea、js、vue3进行前后端分离的技术对查询所有学生信息进行页面展示：即简单单表操作
使用vue.global.js 、 axios.min.js 、进行页面编写
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script src="js/axios.min.js"></script><script src="js/vue.global.js"></script>
</head>
<body><div id="app"><table><tr><td>学号</td><td>姓名</td><td>班级编号</td></tr><tr v-for="stu in students"><td>{{stu.sid}}</td><td>{{stu.sname}}</td><td>{{stu.cid}}</td></tr></table></div><script>const vueApp = Vue.createApp({data(){return{students:""}},created(){axios({url:"http://localhost:8080/day13_war_exploded/student/t02",method:"get"}).then(resp => {this.students = resp.data;});}});vueApp.mount("#app");</script>
</body>
</html>
控制层：
StudentController.java
package com.etime.controller;import com.etime.pojo.Student;
import com.etime.service.StudentService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.CrossOrigin;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;import java.util.List;@Controller
@RequestMapping("/student")
//使用注解@CrossOrigin方式来解决跨域问题
@CrossOrigin
public class StudentController {//本来如果没有用注解的情况下，如果要对service的数据进行访问时，就只能进行对StudentService类进行创建新对象//可以使用@Autowired注解的方式对service进行引入@Autowiredprivate StudentService studentService;@RequestMapping("t02")@ResponseBodypublic List<Student> test(){return studentService.getAllStudent();}
}运行结果：由运行结果可以看出单表操作没有问题
接下来进行 多表查询并进行分页测试，由上可知的 配置中咱们是使用了mybatis分页插件的，可以利用这一工具进行数据分页到html上进行展示：
案例二：
index.html
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script src="js/axios.min.js"></script><script src="js/vue.global.js"></script>
</head>
<body><div id="app"><table align="center"><tr><td>学号</td><td>姓名</td><td>班级</td></tr><tr v-for="stu in students" align="center"><td>{{stu.sid}}</td><td>{{stu.sname}}</td><td>{{stu.classes.cname}}</td></tr></table><div style="width: 500px;margin: auto;"><a href="javascript:void(0)" @click="getStudentByPage(1)">首页</a><a href="javascript:void(0)" @click="getStudentByPage(prevPage)">上一页</a>{{pageNum}}/{{pageTotal}}<a href="javascript:void(0)" @click="getStudentByPage(nextPage)">下一页</a><a href="javascript:void(0)" @click="getStudentByPage(pageTotal)">尾页</a></div></div><script>const vueApp = Vue.createApp({data(){return{students:"",pageNum:"",pageTotal:"",prevPage:"",nextPage:""}},methods:{getStudentByPage(page){axios({url:"http://localhost:8080/day13_war_exploded/student/t02?pageNum="+page+"&pageSize=2",method:"get"}).then(resp => {console.log(resp)this.students = resp.data.list;this.pageNum = resp.data.pageNum;this.pageTotal = resp.data.pages;this.prevPage = resp.data.prePage;if(this.prevPage <= 0){this.prevPage =1;}this.nextPage = resp.data.nextPage;});}},created(){this.getStudentByPage(1);}});vueApp.mount("#app");</script>
</body>
</html>
StudentController.java
package com.etime.controller;import com.etime.pojo.Student;
import com.etime.service.StudentService;
import com.github.pagehelper.PageInfo;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.CrossOrigin;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;import java.util.List;@Controller
@RequestMapping("/student")
//使用注解@CrossOrigin方式来解决跨域问题
@CrossOrigin
public class StudentController {//本来如果没有用注解的情况下，如果要对service的数据进行访问时，就只能进行对StudentService类进行创建新对象//可以使用@Autowired注解的方式对service进行引入@Autowiredprivate StudentService studentService;@RequestMapping("t02")@ResponseBodypublic PageInfo<Student> test(int pageNum,int pageSize){return studentService.getAllStudent(pageNum,pageSize);}
}StudentService.java
package com.etime.service;import com.etime.pojo.Student;
import com.github.pagehelper.PageInfo;public interface StudentService {PageInfo<Student> getAllStudent(int pageNum,int pageSize);
}StudentServiceImpl.java
package com.etime.service.impl;import com.etime.mapper.StudentMapper;
import com.etime.pojo.Student;
import com.etime.service.StudentService;
import com.github.pagehelper.PageHelper;
import com.github.pagehelper.PageInfo;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;import java.util.List;@Service
public class StudentServiceImpl implements StudentService {//使用@Autowired注解将StudentMapper接口引入@Autowiredprivate StudentMapper studentMapper;@Overridepublic PageInfo<Student> getAllStudent(int pageNum, int pageSize) {PageHelper.startPage(pageNum,pageSize);List<Student> list = studentMapper.getAllStudent();PageInfo<Student> pageInfo = new PageInfo<>(list);return pageInfo;}
}StudentMapper.java
package com.etime.mapper;import com.etime.pojo.Student;import java.util.List;public interface StudentMapper {List<Student> getAllStudent();
}StudentMapper.xml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapperPUBLIC "-//mybatis.org//DTD Mapper 3.0//EN""http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.etime.mapper.StudentMapper"><select id="getAllStudent" resultMap="studentAndClasses">select * from student s,classes c where s.cid = c.cid</select><resultMap id="studentAndClasses" type="Student"><id property="sid" column="sid"></id><result property="sname" column="sname"></result><result property="cid" column="cid"></result><association property="classes" javaType="Classes"><id property="cid" column="cid"></id><result property="cname" column="cname"></result></association></resultMap>
</mapper>
并在pojo中创建Classes.java班级实体类
package com.etime.pojo;import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;@AllArgsConstructor
@NoArgsConstructor
@Data
public class Classes {private int cid;private String cname;
}测试结果：到目前为止基本的ssm整合对基础的查询都能成功
ntMapper">
select * from student s,classes c where s.cid = c.cid
<resultMap id="studentAndClasses" type="Student"><id property="sid" column="sid"></id><result property="sname" column="sname"></result><result property="cid" column="cid"></result><association property="classes" javaType="Classes"><id property="cid" column="cid"></id><result property="cname" column="cname"></result></association></resultMap>
```
并在pojo中创建Classes.java班级实体类
package com.etime.pojo;import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;@AllArgsConstructor
@NoArgsConstructor
@Data
public class Classes {private int cid;private String cname;
}测试结果：到目前为止基本的ssm整合对基础的查询都能成功
