SSM 整合+Maven+ Bootstrap搭建简单项目(基础+主要代码)
最近公司要求搭建展示数据的Web平台,虽然只是进行简单的查询展示操作,但正好可以用来练练手。此项目应用Spring+SpringMVC+Mybatis+Maven+Bootstrap。本人技术小白,如有写的不对的地方,欢迎大家批评指正,谢谢。
一.创建Maven工程(过程不累述)
1.目录结构如下图所示:相关文件层次应该一目了然,后面会做详细解读
2.maven依赖导入
maven的依赖位于pom.xml中,要导入ssm等相关jar包的依赖,具体如下
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-webmvc</artifactId>
<version>4.3.7.RELEASE</version>
</dependency>
<!--引入pageHelper分页插件 -->
<dependency>
<groupId>com.github.pagehelper</groupId>
<artifactId>pagehelper</artifactId>
<version>5.0.0</version>
</dependency>
<!-- 返回json字符串的支持 -->
<dependency>
<groupId>com.fasterxml.jackson.core</groupId>
<artifactId>jackson-databind</artifactId>
<version>2.8.8</version>
</dependency>
<!--JSR303数据校验支持;tomcat7及以上的服务器,
tomcat7以下的服务器:el表达式。额外给服务器的lib包中替换新的标准的el
-->
<dependency>
<groupId>org.hibernate</groupId>
<artifactId>hibernate-validator</artifactId>
<version>5.4.1.Final</version>
</dependency>
<!-- Spring-Jdbc -->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-jdbc</artifactId>
<version>4.3.7.RELEASE</version>
</dependency>
<!--Spring-test -->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-test</artifactId>
<version>4.3.7.RELEASE</version>
</dependency>
<!-- Spring面向切面编程 -->
<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-aspects</artifactId>
<version>4.3.7.RELEASE</version>
</dependency>
<!--MyBatis -->
<dependency>
<groupId>org.mybatis</groupId>
<artifactId>mybatis</artifactId>
<version>3.4.2</version>
</dependency>
<!-- MyBatis整合Spring的适配包 -->
<dependency>
<groupId>org.mybatis</groupId>
<artifactId>mybatis-spring</artifactId>
<version>1.3.1</version>
</dependency>
<!-- 数据库连接池、驱动 -->
<dependency>
<groupId>c3p0</groupId>
<artifactId>c3p0</artifactId>
<version>0.9.1</version>
</dependency>
<!-- -->
<dependency>
<groupId>mysql</groupId>
<artifactId>mysql-connector-java</artifactId>
<version>5.1.41</version>
</dependency>
<!-- (jstl,servlet-api,junit) -->
<!-- https://mvnrepository.com/artifact/jstl/jstl -->
<dependency>
<groupId>jstl</groupId>
<artifactId>jstl</artifactId>
<version>1.2</version>
</dependency>
<dependency>
<groupId>javax.servlet</groupId>
<artifactId>javax.servlet-api</artifactId>
<version>3.0.1</version>
<scope>provided</scope>
</dependency>
<!-- junit -->
<!-- https://mvnrepository.com/artifact/junit/junit -->
<dependency>
<groupId>junit</groupId>
<artifactId>junit</artifactId>
<version>4.12</version>
</dependency>
二.Bootstrap
bootatrap是简单的前端框架,相关文件依赖可以去这个上面下载:http://www.bootcss.com/
bootstrap相关教程可在此网站上学习:http://www.runoob.com/bootstrap/bootstrap-tutorial.html
此项目中包括bootstrap、js、图片等相关静态资源都放在webapp目录下的static文件夹中。
三.Spring的相关配置
1.web.xml
启动Spring容器,制定spring配置文件applicationContext.xml的位置,并拦截来自前端的所有请求
<!--1、启动Spring的容器 -->
<!-- needed for ContextLoaderListener -->
<context-param>
<param-name>contextConfigLocation</param-name>
<param-value>classpath:applicationContext.xml</param-value>
</context-param>
<!-- Bootstraps the root web application context before servlet initialization -->
<listener>
<listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
</listener>
<!--2、springmvc的前端控制器,拦截所有请求 -->
<!-- The front controller of this Spring Web application, responsible for handling all application requests -->
<servlet>
<servlet-name>dispatcherServlet</servlet-name>
<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
<load-on-startup>1</load-on-startup>
</servlet>
<!-- 映射所有请求 -->
<servlet-mapping>
<servlet-name>dispatcherServlet</servlet-name>
<url-pattern>/</url-pattern>
</servlet-mapping>
2.applicationContext.xml
在此配置文件中指定spring容器扫描的包(扫描除了controller之外的所有包),以及配置数据源、mybatis、事物控制等。
<context:component-scan base-package="com.bstc">
<context:exclude-filter type="annotation"
expression="org.springframework.stereotype.Controller" />
</context:component-scan>
<!-- Spring的配置文件,这里主要配置和业务逻辑有关的 -->
<!--=================== 数据源,事务控制,xxx ================-->
<context:property-placeholder location="classpath:dbconfig.properties" />
<bean id="pooledDataSource" class="com.mchange.v2.c3p0.ComboPooledDataSource">
<property name="jdbcUrl" value="${jdbc.jdbcUrl}"></property>
<property name="driverClass" value="${jdbc.driverClass}"></property>
<property name="user" value="${jdbc.user}"></property>
<property name="password" value="${jdbc.password}"></property>
</bean>
<!--================== 配置和MyBatis的整合=============== -->
<bean id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean">
<!-- 指定mybatis全局配置文件的位置 -->
<property name="configLocation" value="classpath:mybatis-config.xml"></property>
<property name="dataSource" ref="pooledDataSource"></property>
<!-- 指定mybatis,mapper文件的位置 -->
<property name="mapperLocations" value="classpath:mapper/*.xml"></property>
</bean>
<!-- 配置扫描器,将mybatis接口的实现加入到ioc容器中 -->
<bean class="org.mybatis.spring.mapper.MapperScannerConfigurer">
<!--扫描所有dao接口的实现,加入到ioc容器中 -->
<property name="basePackage" value="com.bstc.dao"></property>
</bean>
<!-- 配置一个可以执行批量的sqlSession -->
<bean id="sqlSession" class="org.mybatis.spring.SqlSessionTemplate">
<constructor-arg name="sqlSessionFactory" ref="sqlSessionFactory"></constructor-arg>
<constructor-arg name="executorType" value="BATCH"></constructor-arg>
</bean>
<!--============================================= -->
<!-- ===============事务控制的配置 ================-->
<bean id="transactionManager" class="org.springframework.jdbc.datasource.DataSourceTransactionManager">
<!--控制住数据源 -->
<property name="dataSource" ref="pooledDataSource"></property>
</bean>
<tx:annotation-driven transaction-manager="transactionManager"/>
三、SpringMVC配置文件
倘若没有在web.xml文件中指定springMVC配置文件的位置,则mvc配置文件默认位置在WEB-INF目录下,默认名为web.xml文件中前端控制器名-servlet.xml,此处为dispatcher-servlet.xml
此处使用IOC注解,并配置视图解析器
<!-- 启用IoC注解 -->
<context:component-scan base-package="com.bstc"/>
<!-- 配置视图解析器,msg ,最终拼接而成的物理视图是:/adsPage/msg.jsp -->
<bean
class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<property name="prefix" value="/WEB-INF/views/" />
<property name="suffix" value=".jsp" />
</bean>
<mvc:annotation-driven></mvc:annotation-driven>
<!-- 把springmvc不能不处理的请求交给tomcat -->
<mvc:default-servlet-handler/>
四、Mybatis配置文件
在Spring配置文件applicationContext.xml中已经指定了全局配置文件和mapper映射文件的位置
1.全局配置文件
此处启用驼峰命名法,使用别名,以及使用了分页插件
<configuration>
<settings>
<setting name="mapUnderscoreToCamelCase" value="true"/>
</settings>
<typeAliases>
<package name="com.bstc.bean"/>
</typeAliases>
<plugins>
<plugin interceptor="com.github.pagehelper.PageInterceptor">
<!--分页参数合理化,防止出现负的页数,和超过实际存在的页数 -->
<property name="reasonable" value="true"/>
</plugin>
</plugins>
</configuration>
2.mapper映射文件
由于我的初始页面有四个查询条件栏(后续会有展示),最少输入一项就能查询出结果,所以此处使用了动态sql
<mapper namespace="com.bstc.dao.TestDao">
<resultMap type="java.util.HashMap" id="FirstMap">
<id column="id" property="id" jdbcType="VARCHAR"/>
<result column="companyName" property="companyName" jdbcType="VARCHAR"/>
</resultMap>
<!-- 根据四个条件查询 查公司-->
<select id="getCompanyByFour" resultMap="FirstMap">
select distinct cominfo.id,cominfo.companyName from cominfo,capabilityinfo
<where>
cominfo.id=capabilityinfo.companyId
<if test="id != null and id.length()>0">
and cominfo.id=#{id}
</if>
<if test="companyName != null and companyName.length()>0">
and cominfo.companyName like "%"#{companyName}"%"
</if>
<if test="checkRange != null and checkRange.length()>0">
and capabilityinfo.checkRange=#{checkRange}
</if>
<if test="abilityName != null and abilityName.length()>0">
and capabilityinfo.name=#{abilityName}
</if>
</where>
order by cominfo.id ASC
</select>
</mapper>
五.相关类的编写
1.dao层:根据查询参数得到公司列表
public interface TestDao {
/**
* 根据四个参数查询公司list
* */
List<Map<String, Object>> getCompanyByFour(@Param("id") String id,@Param("companyName")String companyName,
@Param("checkRange")String checkRange,@Param("abilityName")String abilityName);
2.service层
@Service
public class TestService {
@Autowired
private TestDao testDao;
//测试map接收数据
public List<Map<String, Object>> getCompanyByFour(String id,String companyName,String checkRange,String abilityName){
return testDao.getCompanyByFour(id,companyName,checkRange,abilityName);
}
}
3.controller层,将从数据库查询到的信息返还给前端控制器
@Controller
public class TestController {
@Autowired
private TestService testService;
@RequestMapping("/test")
public String test(@RequestParam(value="pn",defaultValue="1") Integer pn,HttpServletRequest request) {
String id = request.getParameter("id");
String companyName = request.getParameter("companyName");
String checkRange = request.getParameter("checkRange");
String abilityName = request.getParameter("abilityName");
List<Map<String, Object>> lists = testService.getCompanyByFour(id, companyName, checkRange, abilityName);
for(Map<String, Object> map:lists){
for(Entry<String, Object> e:map.entrySet()){
e.getKey();
e.getValue();
System.out.println(e.getKey() + ":" + e.getValue());
}
}
request.setAttribute("companyList", lists);
return "success";
}
}
六.前端代码
由于前端中路径信息经常出错,所以我在head中得到根路径信息
<%
pageContext.setAttribute("APP_PATH", request.getContextPath());
%>
1.查询页面:此表单向controller层发送请求test.action
<form class="form-horizontal" role="form" action="${APP_PATH }/test.action" onsubmit="return check()">
<div class="form-group">
<label for="firstname" class="col-sm-2 control-label">机构ID</label>
<div class="col-sm-8">
<input type="text" class="form-control" id="id" name="id" placeholder="请输入机构ID">
</div>
</div>
<div class="form-group">
<label for="lastname" class="col-sm-2 control-label">机构名称</label>
<div class="col-sm-8">
<input type="text" class="form-control" id="companyName" name="companyName" placeholder="请输入名称">
</div>
</div>
<div class="form-group">
<label for="firstname" class="col-sm-2 control-label">检测对象</label>
<div class="col-sm-8">
<input type="text" class="form-control" id="checkRange" name="checkRange" placeholder="请输入检测对象">
</div>
</div>
<div class="form-group">
<label for="lastname" class="col-sm-2 control-label">项目名称</label>
<div class="col-sm-8">
<input type="text" class="form-control" id="abilityName" name="abilityName" placeholder="请输入项目名称">
</div>
</div>
<div class="form-group">
<div class="col-sm-offset-2 col-sm-10">
<button type="submit" class="btn btn-default" >查询</button>
</div>
</div>
</form>
2.展示页面 success.jsp
<div class="container">
<div class="row">
<div class="col-sm-12">
<h3 class="text-center">机构列表</h3>
<h4 class="text-right"><a href="${APP_PATH }/first.jsp">返回查询页</a></h4>
</div>
</div>
</div>
<div class="container">
<div class="row">
<div class="col-sm-12,row pre-scrollable">
<c:if test="${requestScope.companyList != null}">
<table class="table table-striped">
<tr>
<th>机构名称</th>
<th>机构ID(链接)</th>
</tr>
<c:forEach items="${requestScope.companyList }" var="list">
<tr>
<c:forEach items="${list }" var="map">
<c:choose>
<c:when test="${map.key == 'id' }">
<th><a href="${APP_PATH}/getAll?id=${map.value}">${map.value}</a></th>
</c:when>
<c:otherwise>
<th>${map.value}</th>
</c:otherwise>
</c:choose>
</c:forEach>
</tr>
</c:forEach>
</table>
</c:if>
</div>
</div>
</div>
七.测试
1.查询:输入一个查询条件进行模糊查询
2.查询结果