Java Spring MVC进阶（1）--Spring MVC+H5+AJAX

最新推荐文章于 2024-07-29 06:30:00 发布

布绒熊

最新推荐文章于 2024-07-29 06:30:00 发布

阅读量3.8k

点赞数 1

spring mvc 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

springMVC与jsp整合的例子和项目比较多，但是与html5整合的资料较少，对jsp不太熟，准备用springMVC +html5，想用html作视图，springMVC做后端接口，AJAX与后端交互，经过资料检索和整合，实践成功，下面附一下有用的配置。

首先是web.xml的配置：

1、静态资源不过滤

如果只配置拦截类似于*.do格式的url，则对静态资源的访问是没有问题的，但是如果配置拦截了所有的请求（如我们上面配置的“/”），就会造成js文件、css文件、图片文件等静态资源无法访问。
一般实现拦截器主要是为了权限管理，主要是拦截一些url请求，所以不对静态资源进行拦截。要过滤掉静态资源一般有两种方式，
第一种是采用<mvc:default-servlet-handler />，（一般Web应用服务器默认的Servlet名称是"default"，所以这里我们激活Tomcat的defaultServlet来处理静态文件，在web.xml里配置如下代码即可：）

[html]view plain copy 
    
 <!--　该servlet为tomcat,jetty等容器提供,将静态资源映射从/改为/static/目录，如原来访问　http://localhost/foo.css　,现在http://localhost/static/foo.css　-->  
 <!-- 不拦截静态文件 -->  
 <servlet-mapping>  
     <servlet-name>default</servlet-name>  
     <url-pattern>/js/*</url-pattern>  
     <url-pattern>/css/*</url-pattern>  
     <url-pattern>/images/*</url-pattern>  
     <url-pattern>/fonts/*</url-pattern>  
 </servlet-mapping>  

      Tomcat, Jetty, JBoss, and GlassFish 默认 Servlet的名字 -- "default"
       Resin 默认 Servlet的名字 -- "resin-file"
       WebLogic 默认 Servlet的名字 -- "FileServlet"
       WebSphere 默认 Servlet的名字 -- "SimpleFileServlet"

       如果你所有的Web应用服务器的默认Servlet名称不是"default"，则需要通过default-servlet-name属性显示指定：

[html]view plain copy 
    
 <mvc:default-servlet-handler default-servlet-name="所使用的Web服务器默认使用的Servlet名称" />  

第二种是采用<mvc:resources />，在springmvc的配置文件中加入以下代码：

[html]view plain copy 
    
 <mvc:resources mapping="/js/**" location="/static_resources/javascript/"/>    
 <mvc:resources mapping="/styles/**" location="/static_resources/css/"/>    
 <mvc:resources mapping="/images/**" location="/static_resources/images/"/>  

2、自定义拦截器

   SpringMVC的拦截器HandlerInterceptorAdapter对应提供了三个preHandle，postHandle，afterCompletion方法。preHandle在业务处理器处理请求之前被调用，
   postHandle在业务处理器处理请求执行完成后,生成视图之前执行，afterCompletion在DispatcherServlet完全处理完请求后被调用,可用于清理资源等。所以要想实现自己的权限管理逻辑，需要继承HandlerInterceptorAdapter并重写其三个方法。
   首先在springmvc.xml中加入自己定义的拦截器我的实现逻辑CommonInterceptor，

[html]view plain copy 
    
 <!--配置拦截器, 多个拦截器,顺序执行 -->  
 <mvc:interceptors>    
     <mvc:interceptor>    
         <!-- 匹配的是url路径， 如果不配置或/**,将拦截所有的Controller -->  
         <mvc:mapping path="/" />  
         <mvc:mapping path="/user/**" />  
         <mvc:mapping path="/test/**" />  
         <bean class="com.alibaba.interceptor.CommonInterceptor"></bean>    
     </mvc:interceptor>  
     <!-- 当设置多个拦截器时，先按顺序调用preHandle方法，然后逆序调用每个拦截器的postHandle和afterCompletion方法 -->  
 </mvc:interceptors>  

我的拦截逻辑是“在未登录前，任何访问url都跳转到login页面；登录成功后跳转至先前的url”，具体代码如下：

[java]view plain copy 
    
 /** 
  *  
  */  
 package com.alibaba.interceptor;  
   
 import javax.servlet.http.HttpServletRequest;  
 import javax.servlet.http.HttpServletResponse;  
   
 import org.slf4j.Logger;  
 import org.slf4j.LoggerFactory;  
 import org.springframework.web.servlet.ModelAndView;  
 import org.springframework.web.servlet.handler.HandlerInterceptorAdapter;  
   
 import com.alibaba.util.RequestUtil;  
   
   
 /** 
  * @author tfj 
  * 2014-8-1 
  */  
 public class CommonInterceptor extends HandlerInterceptorAdapter{  
     private final Logger log = LoggerFactory.getLogger(CommonInterceptor.class);  
     public static final String LAST_PAGE = "com.alibaba.lastPage";  
     /* 
      * 利用正则映射到需要拦截的路径     
       
     private String mappingURL; 
      
     public void setMappingURL(String mappingURL) {     
                this.mappingURL = mappingURL;     
     }    
   */  
     /**  
      * 在业务处理器处理请求之前被调用  
      * 如果返回false  
      *     从当前的拦截器往回执行所有拦截器的afterCompletion(),再退出拦截器链 
      * 如果返回true  
      *    执行下一个拦截器,直到所有的拦截器都执行完毕  
      *    再执行被拦截的Controller  
      *    然后进入拦截器链,  
      *    从最后一个拦截器往回执行所有的postHandle()  
      *    接着再从最后一个拦截器往回执行所有的afterCompletion()  
      */    
     @Override    
     public boolean preHandle(HttpServletRequest request,    
             HttpServletResponse response, Object handler) throws Exception {    
         if ("GET".equalsIgnoreCase(request.getMethod())) {  
             RequestUtil.saveRequest();  
         }  
         log.info("==============执行顺序: 1、preHandle================");    
         String requestUri = request.getRequestURI();  
         String contextPath = request.getContextPath();  
         String url = requestUri.substring(contextPath.length());  
         
         log.info("requestUri:"+requestUri);    
         log.info("contextPath:"+contextPath);    
         log.info("url:"+url);    
           
         String username =  (String)request.getSession().getAttribute("user");   
         if(username == null){  
             log.info("Interceptor：跳转到login页面！");  
             request.getRequestDispatcher("/WEB-INF/jsp/login.jsp").forward(request, response);  
             return false;  
         }else  
             return true;     
     }    
     
     /** 
      * 在业务处理器处理请求执行完成后,生成视图之前执行的动作    
      * 可在modelAndView中加入数据，比如当前时间 
      */  
     @Override    
     public void postHandle(HttpServletRequest request,    
             HttpServletResponse response, Object handler,    
             ModelAndView modelAndView) throws Exception {     
         log.info("==============执行顺序: 2、postHandle================");    
         if(modelAndView != null){  //加入当前时间    
             modelAndView.addObject("var", "测试postHandle");    
         }    
     }    
     
     /**  
      * 在DispatcherServlet完全处理完请求后被调用,可用于清理资源等   
      *   
      * 当有拦截器抛出异常时,会从当前拦截器往回执行所有的拦截器的afterCompletion()  
      */    
     @Override    
     public void afterCompletion(HttpServletRequest request,    
             HttpServletResponse response, Object handler, Exception ex)    
             throws Exception {    
         log.info("==============执行顺序: 3、afterCompletion================");    
     }    
   
 }    

注：上述代码里我写了一个RequestUtil,主要实现获取当前Request、Session对象，保存和加密页面，取出等功能。

至此，拦截器已经实现了，效果如图：

我直接访问/test/hello，会被拦截

登录成功后会跳转至/test/hello对应的页面

3、配置html视图

接下来是springMVC-servlet文件：

[html] view plain copy

print ?

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
xmlns:context="http://www.springframework.org/schema/context"
xmlns:p="http://www.springframework.org/schema/p"
xmlns:mvc="http://www.springframework.org/schema/mvc"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xmlns:task="http://www.springframework.org/schema/task"
xsi:schemaLocation="http://www.springframework.org/schema/beans
http://www.springframework.org/schema/beans/spring-beans-3.0.xsd
http://www.springframework.org/schema/context
http://www.springframework.org/schema/context/spring-context.xsd
http://www.springframework.org/schema/mvc
http://www.springframework.org/schema/mvc/spring-mvc-3.0.xsd
http://www.springframework.org/schema/task
http://www.springframework.org/schema/task/spring-task.xsd">
<!--<task:executor id="executor" pool-size="5" />
<task:scheduler id="scheduler" pool-size="10" />
<task:annotation-driven executor="executor" scheduler="scheduler" />
-->
<context:component-scan base-package="com.qingshuang.circ"/>
<!-- 对模型视图名称的解析，在请求时模型视图名称添加前后缀
<bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<property name="viewClass" value="org.springframework.web.servlet.view.JstlView"/>
<property name="prefix" value="/"/>
<property name="suffix" value=".jsp"/>
</bean>
-->
<bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<property name="order" value="10"></property>
<property name="prefix" value="/"></property>
<property name="contentType" value="text/html"></property>
</bean>
</beans>

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
 xmlns:context="http://www.springframework.org/schema/context"
 xmlns:p="http://www.springframework.org/schema/p"
 xmlns:mvc="http://www.springframework.org/schema/mvc"
 xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
 xmlns:task="http://www.springframework.org/schema/task"
 xsi:schemaLocation="http://www.springframework.org/schema/beans
      http://www.springframework.org/schema/beans/spring-beans-3.0.xsd
      http://www.springframework.org/schema/context
      http://www.springframework.org/schema/context/spring-context.xsd
      http://www.springframework.org/schema/mvc
      http://www.springframework.org/schema/mvc/spring-mvc-3.0.xsd
      http://www.springframework.org/schema/task 
      http://www.springframework.org/schema/task/spring-task.xsd">
      
     <!--<task:executor id="executor" pool-size="5" />  
      <task:scheduler id="scheduler" pool-size="10" />  
      <task:annotation-driven executor="executor" scheduler="scheduler" /> 
       -->
      
     <context:component-scan base-package="com.qingshuang.circ"/>
      
      <!-- 对模型视图名称的解析，在请求时模型视图名称添加前后缀
      <bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
     	<property name="viewClass" value="org.springframework.web.servlet.view.JstlView"/>
     	<property name="prefix" value="/"/>
    	<property name="suffix" value=".jsp"/>
      </bean>
       -->
       <bean  class="org.springframework.web.servlet.view.InternalResourceViewResolver">
  		<property name="order" value="10"></property>
  		<property name="prefix" value="/"></property>
  		<property name="contentType" value="text/html"></property>
  	</bean>
</beans>

当然springMVC也支持多视图，比如json、pdf、jsp等等，具体配置大家可以看一下这篇文章：http://loushi135.iteye.com/blog/1676280

以下是控制器代码：

[java] view plain copy

print ?

@Controller
@RequestMapping(value="/test")
public class TestController {
/**
* 测试请求是否成功
* @author
* @version
* @since V0.1
*/
@RequestMapping(value="{testAdmin}", method=RequestMethod.GET)
public String testRequest(){
System.out.println("----------------请求成功----------------");
return "admin/login.<span style="font-family:Helvetica, Tahoma, Arial, sans-serif;">html</span>";
}
}

@Controller
@RequestMapping(value="/test")
public class TestController {
	
	/**
	 * 测试请求是否成功
	 * @author          
	 * @version         
	 * @since 	V0.1
	 */
	@RequestMapping(value="{testAdmin}", method=RequestMethod.GET)
	public String testRequest(){
		System.out.println("----------------请求成功----------------");
		return "admin/login.<span style="font-family:Helvetica, Tahoma, Arial, sans-serif;">html</span>";
	}
	
}

html目录:

4、通过@ResponseBody 配置后端接口

@ResponseBody 将内容或对象作为 HTTP 响应正文返回，并调用适合HttpMessageConverter的Adapter转换对象，写入输出流。
通过此注解可以将后端接口的返回数据作为http响应返回到前端。
Spring默认的json协议解析由Jackson完成。

servlet.xml配置

Spring的配置文件，简洁到了极致，对于当前这个需求只需要三行核心配置：
Xml代码
1. <context:component-scan base-package="org.zlex.json.controller" />
2. <context:annotation-config />
3. <mvc:annotation-driven />
pom.xml配置或依赖包

先说依赖配置，这里以Json+Spring为参考：
pom.xml
Xml代码
1. <dependency>
2. <groupId>org.springframework</groupId>
3. <artifactId>spring-webmvc</artifactId>
4. <version>3.1.2.RELEASE</version>
5. <type>jar</type>
6. <scope>compile</scope>
7. </dependency>
8. <dependency>
9. <groupId>org.codehaus.jackson</groupId>
10. <artifactId>jackson-mapper-asl</artifactId>
11. <version>1.9.8</version>
12. <type>jar</type>
13. <scope>compile</scope>
14. </dependency>
15. <dependency>
16. <groupId>log4j</groupId>
17. <artifactId>log4j</artifactId>
18. <version>1.2.17</version>
19. <scope>compile</scope>
20. </dependency>
主要需要spring-webmvc、jackson-mapper-asl两个包，其余依赖包Maven会帮你完成。至于log4j，我还是需要看日志嘛。
包依赖图：

5、前后端及ajax整合

页面

<h2>1、生成随机字符串长度</h2>
<input  id="a" placeholder="请输入长度" type="text" ></input>
<button id=abc class="btn1"  >生成</button>
<p id=result></p>

js

$(".btn1").click(function(){
		//alert("a");
		var length= $("#a").val();
		$.ajax({
		    type: "POST",
            url: "/SpringDemo/getMixstr.do?",
			async:false,
			data:"length="+length,
         //	dataType: "text",
            success: function(msg) {    //数据提交成功时返回数据
            //	alert(msg);
            	//$(this).parent.append("<div id='result'>"+data+"<div>");
				    $("#result").html(msg);
								
				
               }
		});
	});

后端

@Controller
public class strCtrol {
	
	@RequestMapping(value="/getMixstr",method=RequestMethod.POST)   //此处控制浏览器里访问路径 具体为：/SpringDemo/helloworld
	public @ResponseBody String getMixstr(HttpServletRequest request ,HttpServletResponse response) throws IOException{
		String length=request.getParameter("length");
		String str=RandomUtil.genMixStr(Integer.valueOf(length));
		
		return str;
		
	}
	
	
	@RequestMapping(value="/genTimeStr",method=RequestMethod.POST,produces="application/json")   //此处控制浏览器里访问路径 具体为：/SpringDemo/helloworld
	public @ResponseBody long genTimeStr(HttpServletRequest request ,HttpServletResponse response) throws IOException{
		String length=request.getParameter("length");
		long str=RandomUtil.genTimeStr(Integer.valueOf(length));
		
		return str;
		
	}

效果图

布绒熊

关注

1
点赞
踩
12

收藏

觉得还不错? 一键收藏
0
评论
Java Spring MVC进阶（1）--Spring MVC+H5+AJAX

springMVC与jsp整合的例子和项目比较多，但是与html5整合的资料较少，对jsp不太熟，准备用springMVC +html5，想用html作视图，经过资料检索和整合。实践成功，下面附一下有用的配置。首先是web.xml的配置：1、静态资源不过滤如果只配置拦截类似于*.do格式的url，则对静态资源的访问是没有问题的，但是如果配置拦截了所有的请求（如我
复制链接

扫一扫

专栏目录