web工程之SSM快速搭建示例程序(文末含代码附件)
2016-12-12 22:43
381 查看
技术简介
Spring+SpringMVC+Mybatis前端框架:velocity,ace admin, jquery。
SpringMVC
Spring MVC属于SpringFrameWork的后续产品,已经融合在Spring Web Flow里面。Spring Web MVC是一种基于Java的实现了Web MVC设计模式的请求驱动类型的轻量级Web框架,将web层进行职责解耦,基于请求驱动指的就是使用请求-响应模型,框架的目的就是帮助我们简化开发。SpringMVC请求处理流程流程图:
Velocity
Velocity 是一个基于java 的模板引擎(template engine)。它性能良好,不支持java代码所以能实现严格的MVC分层。支持VTL表达式语言、宏定义。velocity宏非常好用,类似函数,一处声明,其它地方一行代码即可引用,见文末分页宏示例。代码示例:声明用#,变量引用$,foreach和宏使用。
配置文件
web.xml<?xml version="1.0" encoding="UTF-8"?> <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" version="3.0"> <display-name>Archetype Created Web Application</display-name> <!-- Spring监听器:加载指定配置文件到context上下文 --> <context-param> <param-name>contextConfigLocation</param-name> <param-value> classpath:spring/spring-mybatis.xml </param-value> </context-param> <listener> <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class> </listener> <!-- 编码过滤器 --> <filter> <filter-name>encodingFilter</filter-name> <filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class> <async-supported>true</async-supported> <init-param> <param-name>encoding</param-name> <param-value>UTF-8</param-value> </init-param> </filter> <filter-mapping> <filter-name>encodingFilter</filter-name> <url-pattern>/*</url-pattern> </filter-mapping> <!-- Spring MVC servlet:默认是查找/SpringMVC-servlet.xml --> <servlet> <servlet-name>SpringMVC</servlet-name> <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class> <init-param> <param-name>contextConfigLocation</param-name> <param-value>classpath:/spring/spring-mvc.xml</param-value> </init-param> </servlet> <servlet-mapping> <servlet-name>SpringMVC</servlet-name> <url-pattern>/</url-pattern> </servlet-mapping> <welcome-file-list> <welcome-file>/index.html</welcome-file> </welcome-file-list> </web-app>
spring-mvc.xml
<?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:mvc="http://www.springframework.org/schema/mvc" xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-3.1.xsd http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context-3.1.xsd http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc-3.1.xsd"> <!-- 处理静态资源的请求:如图片、样式表、js等:所有由/resources路径开头的请求都由/resources及子目录提供服务 --> <mvc:resources mapping="/assets/**" location="/assets/" /> <!-- 配置注解驱动控制器:bean,controller映射bean或URL --> <mvc:annotation-driven /> <!-- 配置将指定目录下使用注解@的类注册为bean --> <context:component-scan base-package="com.jd.jr.know" /> <!-- 配置VM视图解析器:使用prefix属性和suffix属性由视图的逻辑名构造出模板文件路 --> <bean class="org.springframework.web.servlet.view.velocity.VelocityLayoutViewResolver"> <property name="cache" value="false" /> <property name="suffix" value=".vm" /><!-- 视图文件的后缀名 --> <property name="contentType" value="text/html;charset=UTF-8" /> <!-- 默认只将请求简单传递给jsp,要使用vm标签需要指定特定view。 --> <property name="viewClass" value="org.springframework.web.servlet.view.velocity.VelocityLayoutView" /> <!-- layout布局设置, --> <property name="layoutUrl" value="common/layout.vm" /> <property name="dateToolAttribute" value="dateFormat"/> <property name="exposeSpringMacroHelpers" value="true"/> <property name="requestContextAttribute" value="request"/> </bean> <!-- velocity配置视图文件 --> <bean id="velocityConfig" class="org.springframework.web.servlet.view.velocity.VelocityConfigurer"> <property name="resourceLoaderPath"> <value>/WEB-INF/vm/</value> </property> <property name="configLocation" value="classpath:spring/velocity.properties" /> </bean> </beans>
spring-mybatis.xml
<?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:tx="http://www.springframework.org/schema/tx" xmlns:aop="http://www.springframework.org/schema/aop" xsi:schemaLocation="http://www.springframework.org/schema/beans http://www.springframework.org/schema/beans/spring-beans-4.1.xsd http://www.springframework.org/schema/context http://www.springframework.org/schema/context/spring-context.xsd http://www.springframework.org/schema/tx http://www.springframework.org/schema/tx/spring-tx-3.1.xsd http://www.springframework.org/schema/aop http://www.springframework.org/schema/aop/spring-aop-3.1.xsd"> <bean id="dataSource" class="com.wangyin.commons.cp.WangyinCPDataSource"> <property name="propertiesLocation" value="classpath:db.properties" /> </bean> <context:component-scan base-package="com.jd.jr.know" /> <!-- ===============针对myBatis的配置项=========== --> <bean id="sqlSessionFactory" class="org.mybatis.spring.SqlSessionFactoryBean"> <property name="dataSource" ref="dataSource" /> <property name="mapperLocations" value="classpath:mybatis/mappers/*.xml" /> </bean> <!-- 配置扫描器 --> <bean class="org.mybatis.spring.mapper.MapperScannerConfigurer"> <!-- 扫描me.gacl.dao这个包以及它的子包下的所有映射接口类 --> <property name="basePackage" value="com.jd.jr.know.dao" /> <property name="sqlSessionFactoryBeanName" value="sqlSessionFactory" /> </bean> <!-- 配置Spring的事务管理器 --> <bean id="transactionManager" class="org.springframework.jdbc.datasource.DataSourceTransactionManager"> <property name="dataSource" ref="dataSource" /> </bean> <!-- 拦截器方式配置事物 --> <tx:advice id="transactionAdvice" transaction-manager="transactionManager"> <tx:attributes> <tx:method name="query*" propagation="REQUIRED" /> <tx:method name="select*" propagation="REQUIRED" /> <tx:method name="delete*" propagation="REQUIRED" /> <tx:method name="update*" propagation="REQUIRED" /> <tx:method name="add*" propagation="REQUIRED" /> <tx:method name="insert*" propagation="REQUIRED" /> <tx:method name="del*" propagation="REQUIRED" /> <tx:method name="*" propagation="SUPPORTS" /> </tx:attributes> </tx:advice> <aop:config> <aop:pointcut id="transactionPointcut" expression="execution(* com.jd.jr.know.service..*Service.*(..))" /> <aop:advisor pointcut-ref="transactionPointcut" advice-ref="transactionAdvice" /> </aop:config> </beans>
velocity.properties
input.encoding=UTF-8 output.encoding=UTF-8 contentType=text/html;charset=UTF-8 #directive.foreach.counter.name=vmForCount directive.foreach.counter.initial.value=1 velocimacro.library = common/macro.vm velocimacro.library.autoreload = true
JAVA文件
@RequestMapping(value = "/queryByPage", method = RequestMethod.POST) public String queryContentByPage(@RequestParam("pageNo") int pageNo, Model model, ContentRequest contentRequest) { //写业务逻辑,contentRequest初始化用于传递表单对象参数,tagList为响应数据 model.addAttribute("tagList", tagList); model.addAttribute("contentRequest", contentRequest); return "article/articleMng"; }
@RequestMapping(value = "/query", method = RequestMethod.GET,produces = "text/html;charset=UTF-8") public @ResponseBody String query(@RequestParam("sourceTag") String sourceTag,Model model) { //处理json,包括乱码问题 StringBuilder html = new StringBuilder(); for (CnSourceTag cnSourceTag : sourceTagList) { html.append("<option value='"+cnSourceTag.getTagName()+"'>"+cnSourceTag.getTagName()+"</option>"); } return html.toString(); }
velocity分页通用宏
#macro( macroPage $reqURL) <div align="center" id="pager"> #if($basePage.pageNo==1) <span >首页</span> <span >前一页</span> #else #set($pageNo = 1) <span ><a class="pageQuery" href="$reqURL$pageNo">首页</a></span> #set($pageNo = $basePage.pageNo - 1) <span ><a class="pageQuery" href="$reqURL$pageNo">前一页</a></span> #end <span >|Page <input id="pageSize" type="text" style="width:6%;" value="$basePage.pageNo"/>of $basePage.totalPage|</span> #if($basePage.pageNo==$basePage.totalPage) <span >后一页</span> <span >尾页</span> #else #set($pageNo = $basePage.pageNo + 1) <span ><a class="pageQuery" href="$reqURL$pageNo">后一页</a></span> <span ><a class="pageQuery" href="$reqURL$basePage.totalPage">尾页</a></span> #end <span >共$basePage.count条</span> </div> #end
layout.vm部局
<!DOCTYPE html> <html lang="en"> <!-- 添加header.vm --> #parse("/common/header.vm") <!-- 这里添加left --> #parse("/common/leftMenu.vm") <!-- 这里添加main_content --> $screen_content <!-- 这里添加foot --> #parse("/common/footer.vm") #parse("/common/script.vm") #parse($script) </body> </html>
标准页面写法
<div id="dialog"></div> #set($footerJs=["jquery.nestable.min.js","jquery-ui.custom.min.js",]) #set($script="relation/relationScript.vm")
不使用layout的写法
#set($layout = "/common/blank.vm") <div id="dialog"></div>
jquery
<script language="JavaScript"> jQuery(function($){ querySourceTags(); submitPage(); updateTag(); }); function updateTag(){ //弹框显示 $("#updateTag").on('click',function(){ $("#updateDialog").load($(this).attr("href"),{"x": Math.random()}, function(){ var dialog = $("#updateDialog").dialog({ autoOpen:false, modal: true, width: 450, show: 'clip', hide: 'explode', resizable: false, title: "修改文章标签", draggable: false }).dialog('open'); }); return false; }); } function submitPage(){ //带查询form的分页提交 $(".pageQuery").on('click',function(){ var href = $(this).attr("href"); var pageNo = href.substring(href.lastIndexOf("=")+1); $("#pageNo").val(pageNo); $("#submitBtn").click(); return false; }); } function querySourceTags(){ var engine = $('.EngineModel'); //可编辑select具体实现 var focus = false; $("#inputModel").focus(function () { focus = true; $(this).next().css('display', 'block'); }).blur(function () { if (focus) { $(this).next().css('display', 'none'); } }).keyup(function () { var queryCondition = $("#inputModel").val().toLowerCase(); if (queryCondition.length >= 2) { $.get("../sourceTag/query.vm?sourceTag="+queryCondition,function(data){ $("#EngineModel").empty(); $("#EngineModel").html(data); }); } }).next().mousedown(function () { focus = false; }).change(function () { $(this).css('display', 'none').prev().val(this.value); }); } </script>
示例代码:
SSM工程demo.zip
参考文档
bootstrap:英文官网:http://getbootstrap.com/ ,
中文官网: http://v3.bootcss.com/
jquery: 轻量级的js框架。
官网: http://jquery.com/
ace官网: http://ace.jeka.by/
velocity官网:http://velocity.apache.org/
相关文章推荐
- SpringBoot-快速搭建WEB工程
- 快速搭建简单的springMvc框架的动态web工程
- 如何用Baas快速在腾讯云上开发小程序-系列1:搭建API & WEB WebSocket 服务器
- SSM(SpringMVC+Spring+Mybatis)框架搭建以及示例web
- Node.js搭建WEB服务器的示例代码
- Exchange Web Service 获取邮件的附件并保存到本地的示例代码
- Spring Boot快速搭建Web工程
- Spring boot 入门系列(一):快速搭建一个简单web系统(简单的SSM框架)
- 如何用Baas快速在腾讯云上开发小程序-系列1:搭建API & WEB WebSocket 服务器
- Eclipse JavaEE +Tomcat 搭建web工程 servlet示例
- 开源框架系列:.NET Enterprise CMS Framework --- RapidWebDev 快速开发产品管理示例程序
- Windows Forms 实现安全的多线程详解(附带程序代码示例)
- AjaxPanel自定义控件实现页面无刷新数据交互(做了个示例程序, 效果确实比较Cool, 用法非常简单! )(示例代码下载)
- [推荐]ASP.NET 2.0 快速入门系列课程(附代码示例)[WMV]
- ComponentOne之WebChart(柱状图)(示例代码下载)
- 使用Session State快速、可扩展、安全的管理Web程序(一)
- C#实现通过程序自动抓取远程Web网页信息的代码
- AjaxPanel自定义控件实现页面无刷新数据交互(做了个示例程序, 效果确实比较Cool, 用法非常简单! )(示例代码下载)
- AjaxPanel自定义控件实现页面无刷新数据交互(做了个示例程序, 效果确实比较Cool, 用法非常简单! )(示例代码下载)
- Windows Forms 实现安全的多线程详解(附带程序代码示例) (摘自网络)