CMS项目总结

一、项目架构：b/s架构 前台：公司官网信息维护 后台：后台内容管理
二、技术选型：开发工具：eclipse 数据库：MySQL 后端框架：SSM 前端框架：jQuery Bootstrap Gridmanager
三、功能实现：
1.用户登录登出：重点1：配置拦截器

配置拦截器有两种方式：
一是要定义的Interceptor类要实现了Spring的HandlerInterceptor 接口

package cn.itsource.interceptor;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import org.springframework.web.servlet.HandlerInterceptor;
import org.springframework.web.servlet.ModelAndView;

public class LoginInterceptor implements HandlerInterceptor {

	@Override
	public void afterCompletion(HttpServletRequest arg0, HttpServletResponse arg1, Object arg2, Exception arg3)
			throws Exception {
		// TODO Auto-generated method stub

	}

	@Override
	public void postHandle(HttpServletRequest arg0, HttpServletResponse arg1, Object arg2, ModelAndView arg3)
			throws Exception {
		// TODO Auto-generated method stub

	}

	@Override
	public boolean preHandle(HttpServletRequest req, HttpServletResponse resp, Object arg2) throws Exception {
		Object user = req.getSession().getAttribute("USER_IN_SESSION");
		if (user == null) {
			resp.sendRedirect("/system/login");
			return false;
		}
			return true;
	}

}

二是继承实现了HandlerInterceptor接口的类，比如Spring已经提供的实现了HandlerInterceptor接口的抽象类HandlerInterceptorAdapter

public class LoginInterceptor extends HandlerInterceptorAdapter {
    @Override
    public boolean preHandle(HttpServletRequest req, HttpServletResponse response, Object o) throws Exception {
        //在session中获取当前登录用户
        Object user = req.getSession().getAttribute(Constant.USER_IN_SESSION);
        if(user == null){
		//如果为空，就证明用户没有登录，跳转到登录界面
            response.sendRedirect("/system/login");
            return false;
        }
        return true;
    }
}

然后在applicationContext-mvc.xml中配置拦截器

<!-- 配置拦截器组 -->
	<mvc:interceptors>
		<!-- 拦截器 -->
		<mvc:interceptor>
			<!-- 要拦截的配置，该配置必须写在不拦截的上面，/*拦截一级请求，/**拦截多级请求 -->
			<mvc:mapping path="/system/**" />
			<!-- 设置不拦截的配置 -->
			<!-- <mvc:exclude-mapping path="/upload" /> -->
			<mvc:exclude-mapping path="/system/login" />
			<!-- 配置拦截器 -->
			<bean class="cn.itsource.interceptor.LoginInterceptor" />
		</mvc:interceptor>
	</mvc:interceptors>

重点2：记住密码如何实现
cookie和session的区别：
cookie:保存在客户端，不安全，存储数量有限，主要用在记住密码，购物车功能等；
session:保存在服务器端，安全性高，存储数量大，主要用在判断用户是否登录 ；
controller代码：

@RequestMapping(value="/login",method=RequestMethod.POST)
	@ResponseBody
	public AjaxResult login(Integer remember,String username,String password,HttpServletRequest req,HttpServletResponse resp){
		
		try {
			
			User user = service.login(username,password);
			//放入session中
			req.getSession().setAttribute("USER_IN_SESSION", user);
			if (remember!=null) {
				System.out.println("ssssssssss");
				Cookie c1 = new Cookie("username",username);
				Cookie c2 = new Cookie("password",password);
				//设置路径
				c1.setPath("/");
				c2.setPath("/");
				//生命周期
				c1.setMaxAge(7*24*60*60);
				c2.setMaxAge(7*24*60*60);
				//响应到前台
				resp.addCookie(c1);
				resp.addCookie(c2);
			}else {
				Cookie[] cookies = req.getCookies();
				for (Cookie cookie : cookies) {
					if (cookie.getName().equals("username")||cookie.getName().equals("password")){
						cookie.setPath("/");
						cookie.setMaxAge(0);
						resp.addCookie(cookie);
						
					}
					
				}
			}
			return new AjaxResult();
		} catch (Exception e) {
			return new AjaxResult(false,e.getMessage());
		}
	}

前端代码：

	<script type="text/javascript">
	$(function(){	
		// 绑定键盘事件
		$(document).on("keypress",function(e){
			//console.debug(e.keyCode);
			if(e.keyCode==13){
				login();
			}
		});	
		// 绑定单击事件
		$("#loginBtn").click(function(){
			// 发送异步请求
			login();
		});
		// 抽取登录方法
		function login(){
			$("#loginForm").ajaxSubmit({
				success:function(msg){
					//console.debug(msg);
					if(msg.result){
						//跳转到后台首页
						location.href="/system/index";
					}else{
						$("#loginError").html(msg.error).css("color","red").css("fontSize","13px");
					}
				}
			});
		}
		
		// 记住我功能
		// 获取cookie中的数据
		var cookies = document.cookie;   //username=root; password=123; age=20
		
		
		if(cookies.indexOf("username=")!=-1){ // 记住我了
			//console.debug(cookies);
			// 根据;切割
			var arr = cookies.split(";")
			//console.debug(arr);
			//遍历
			for(var i in arr){
				//console.debug(arr[i])
				// 判断是否包含username
				if(arr[i].indexOf("username")!=-1){
					var username = arr[i].substring(arr[i].indexOf("=")+1);
					// 回显
					$("#username").val(username);
					//console.debug(username);
				}
				if(arr[i].indexOf("password")!=-1){ // 获取密码
					var password = arr[i].substring(arr[i].indexOf("=")+1);
					// 回显
					$("#password").val(password);
					// 选中记住我
					$("#remember").prop("checked",true);
				}		
			}
		}else{
			// 取消记住我
			$("#username").val("");
			$("#password").val("");
			$("#remember").prop("checked",false);
		}
		
		
	});
	</script>

注销：

	@RequestMapping(value="/logout")
	public String logout(HttpServletRequest req){
		// 操作  销毁session
		req.getSession().invalidate();		
		return "login";
	}

2.文章的增删改查：