SSM购物商城项目开发

开发环境 ：

当前用myeclipse （idea） jdk7 tomcat 8,.5

创建项目

new —— web project ——— 记得把web.xml勾上

SSM框架整合配置

添加依赖

添加依赖的方式常用的有两种：

1. 通过maven创建 项目，通过maven来添加依赖
2. 本地导入对应的jar包，初学者可以使用，不过添加内容比较多

我们现在用本地导入 WEB-INF --lib文件夹中

添加配置文件

1、spring的基本配置
applicationContext.xml文件的配置
由于需要配置的内容比较多，我们可以成多个文件进行配置
在这里：applicationContext-dao.xml applicationContext-service.xml applicationContext-tx.xml

基本配置：命名空间和约束条件，来源于官网的模板
2、springMVC的基本配置
创建springMVC.xml文件，添加约束
3、mybatis的配置
4、log4j.properties配置
一般情况我们使用通用配置，如果有特殊要求，可以去学log4j的配置语法

开始整合配置

1、在web.xml(项目自带的配置文件) 配置其他配置文件启动或者关联
1.1、实例化并启动spring的容器（加载applicationContext，让这个配置文件起作用）

   
  
  		
      contextConfigLocation
      classpath:applicationContext-*.xml
  
  
  
     org.springframework.web.context.ContextLoaderListener
  

1.2、添加springmvc的配置

  
     DispatcherServlet
     org.springframework.web.servlet.DispatcherServlet
     
     
         contextConfigLocation
         classpath:springMvc.xml
     
  
  
     DispatcherServlet
     *.action
  

1.3、添加编码过滤器

 
  
     characterFilter
     org.springframework.web.filter.CharacterEncodingFilter
     
         encoding
         UTF-8
     
  
  
      characterFilter
       
      /*
  

2、其他配置按照正常开发流程，应该在这里配置（我们作为初学者，在需要的时候配置）

能够在浏览器上访问网页界面

1、创建前端界面
一般我们的前端界面放在WEB-INF下面自己创建的文件夹中，因为webRoot文件夹下，除了WEB-INF以外，都是对外开放的
我们的界面源码应该是被保护的
2、创建控制器
创建一个单独的包，用来存放所有的控制器

@Controller
public class IndexController {
	
	//匹配访问路径
	@RequestMapping("/index")
	public String index(){
		System.out.println("进来");
		//返回的是你要访问的页面的名字（不包含后缀）
		return "index";
	}

}

3、在springMvc.xml文件配置扫描器和视图解析器

4、浏览器访问： http://loalhost:8080/GouWuShangCheng/index.action

总结：访问页面数据流跑通流程

SSM框架数据加载流程（springMVC 的model）

1、数据库的配置
在applicationContext-dao.xml文件配置dataSource

1.1配置数据库的连接（数据库的驱动和数据库版本必须匹配），配置连接池，还有数据库的连接

1.2 配置mybatis的sqlsession，将dataSource注入进来

1.3 在applicationContext-tx.xml中配置数据源的事务管理

1.4 简单的配置mybatis（也可以不配置）

2、操作数据库，其实就是Mapper映射器的编写
2.0 pojo类的编写
2.1 、编写CategoryMapper.java文件
创建一个interface接口文件

 public interface CategoryMapper {
	/*查询所有目录的方法*/
	public List selectALLCategory();
	}
	
2.2 、创建CategoryMapper.xml文件
   2.2.1 由于查询语句的返回是一个结果集，所以这里需要自定义映射集

   
   
       
       
       
       
           
           
           
       
   

2.2.2 编写sql语句

    
      select category.*,categorysecond.* from category,categorysecond where
      category.cid= categorysecond.cid
   

2.3 在applicationContext-dao.xml中配置mapper的扫描器

3、业务逻辑代码的编辑，也就是service的编写

3.1 编写service类
在service里，我们调用mapper的方法，获取数据库的操作结果，然后进行逻辑处理

  public class CategoryService {
	
	@Autowired
	public CategoryMapper categoryMapper;
	
	/*调用mapper映射器的方法，或者数据库操作结果，并处理
	 * 这里是获取所有的目录*/
	public List  findAllCategory(){
		 //调用mapper方法，回去操作结果
	     List list=categoryMapper.selectALLCategory();
	     if(list!=null&&list.size()!=0){
	    	 return list;
	     }else{
	    	 return null;
	     }
	}
	
}

3.2 在applicationContext-service.xml中配置service的bean

3.3 在applicationContext-tx.xml中以service为aop的切入点，配置aop切面的切入点

4、在controller中调用service的方法，获取结果，向前端返回结果

@Controller
public class IndexController {
	
	@Autowired
	public CategoryService  categoryService;
	

	@RequestMapping("/index")
	public String index(Model model){
		//获取目录的数据，然后返回给前端界面
		List cList=categoryService.findAllCategory();
		
		model.addAttribute("cList", cList);
		
		return "index";
	}

} 

5、在前端接收数据

				

				     
					
						

							

								
									${c.cName} 
							
							
								

									
										${cs.csName}
								
							
						
					
				
			

登录功能实现

1、访问登录界面
把界面jsp文件放到正确的位置
创建controller，定义一个匹配请求路径的方法，返回登录界面的文件名

 /*登录界面访问控制*/
	@RequestMapping("/login")
	public String login(){
		return "login";
	}

2、在这里我们做了一个用户名验证，一般登录不做，注册才做
用户名验证我们使用ajax进行验证
2.1 前端ajax请求代码

 function checkUsername() {
	var username = document.getElementById("username").value;
	/* 针对中文编码 */
	/* ajax如果提交post请求的话可以直接进行设置编码  如果是get请求可以在浏览器端进行加密处理 然后在服务器端进行解密   */
	/* var username = encodeURIComponent(encodeURIComponent(name)); */
	var xmlHttp = creatXMLHttpreauest();
	/* xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); */
	xmlHttp.open("GET",
			"${pageContext.request.contextPath}/checkName.do?username="
					+ username, true);
	xmlHttp.send(null); 
	xmlHttp.onreadystatechange = function() {
		if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
		//接收响应结果
			var result= xmlHttp.responseText;
			if(result=="0"){
			   document.getElementById("span1").innerHTML="用户名不存在";
			}else if(result=="1"){
			   document.getElementById("span1").innerHTML="用户名正确";
			}else{
			   document.getElementById("span1").innerHTML="用户名不能为空";
			}
		}
	}
}
function creatXMLHttpreauest() {
	try {
		return new XMLHttpRequest();
	} catch (e) {
		try {
			return ActiveXObject("Msxml2.XMLHttp");
		} catch (e) {
			try {
				return ActiveXObject("micoresoftxml2.XMLHttp");
			} catch (e) {
				throw e;
			}
		}
	}
}

2.2 服务端接收
2.2.1 在controller中创建一个方法用来匹配这个ajax的请求，接收请求内容

/*检查用户名是否存在的控制方法*/

@RequestMapping("/checkName")
public void checkUserName(HttpServletRequest req,HttpServletResponse resp){
	//接收前端传递过来的数据，因为是用键值对传送，我们根据键获取值
	String userName=req.getParameter("username");

}

2.2.2 创建用户user表对应的pojo类

2.2.3 创建映射器
UserMapper.java

/**
 * 
 * @author zf
 * 用户信息的mapper接口
 *
 */
public interface UserMapper {
	
	/*根据用户名 查询用户*/
	public User  selectByUserName(String username);
	

}

UserMapper.xml

   
   
     
     select * from user where username= #{username}
   
   

2.2.4 创建UserService，进行逻辑处理

@Autowired
public UserMapper userMapper;

/*根据用户名查询用户的方法，返回0代表没有查到，1代表查到*/
public String selectByUserName(String name){
	User user=userMapper.selectByUserName(name);
	if(user==null){
		return "0";
	}else{
		return "1";
	}
	
	}

在applicationContext-service.xml文件中配置service

2.2.5 回到controller中，调用service，返回结果给前端

/*检查用户名是否存在的控制方法*/
	@RequestMapping("/checkName")
	public void checkUserName(HttpServletRequest req,HttpServletResponse resp){
		//接收前端传递过来的数据，因为是用键值对传送，我们根据键获取值
		String userName=req.getParameter("username");
		try {
			PrintWriter writer=resp.getWriter();
			if(userName!=null &&!userName.equals("")){
				String result=userService.selectByUserName(userName);
				writer.write(result);
			}else{
				writer.write("2");
			}
		} catch (IOException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
		
	}