案列总结

总结的知识点

• ①. name里面的数据是提交到后台的名字
  
• ②. EL表达式的不同写法

注意：
(1). href="$pageContext.request.contextPath/findUserServlet？id=${user.id}">修改
在html中给属性赋值的时候，el表达式要放到引号里面。表示引号里面的所有数据是给这个href属性赋值的。在html中没有用+组拼字符串这一说
(2). 用+连接字符串，只有java和js中有这个功能:
location.href="${pageContext.request.contextPath}/deleteUserServlet?id="+id;

• ③. 使用转发和重定向的问题

注意：
(1). 一般想要用request域共享数据。只能用转发
(2). 如果不需要共享数据，可以使用转发和重定向都可以，重定向只会刷新最后重定向后的页面，推荐使用

• ④. a标签中的href属性

• ⑤. js中两个常见方法
  

旅游网

Controller:[servlet、SpringMvc]
    (1).设置请求编码(这样我们从前台获取的参数不会乱码)
    (2).获取请求的参数
    [String getParameter()|| Map getParameterMap()]
    (3).封装java对象
    (4).调用service进行相关操作
    (5).根据service结果进行相关操作
    (6).对jsp页面的处理方式:
            如果是jsp页面,一般会将查询回来的结果保存到request域中,转发到jsp页面
            如果查询回来的结果不需要保存request域中,转发到jsp页面[查询所有信息的servlet] 
    (7).对html页面的处理方式:
            将数据保存到一个model对象中，这个model对象中有响应的信息[参数:falg data msg ]
            将model序列化为json格式
            将数据响应到浏览器页面中[这个数据会在success:function(data){}的data中]

1.day01[注册、登录、邮箱激活、记住名字、退出]

• ①. 注册功能前台代码
  

1.步骤：
(1).利用js完成表单验证

1.1 失去焦点完成校验

1.2 表单提交(只有都验证成功,才发送异步ajax)
注意：这里②一定要为false,表示异步请求,不会跳转页面

(2).使用ajax完成表单提交($(this).serialize()获取表单中所有的数据)
(3).根据后端响应回来的数据进行判断
如果注册成功,跳转到成功页面
如果注册失败,给出相对应的提示信息

2.前台代码注意事项
(1).离焦事件
(2).获取表单所有的数据
(3).在表单提交的时候 [ 如果function没有返回值,或者返回为true,则表单提交;如果返回为false,则表单不提交 ]

• ②. 后台代码

步骤
servlet
(1).验证码验证
1.1 分别获取表单的验证码和session中取出的验证码
1.2 设置为一次性验证码
1.3 对前端输入值的验证码和sesson取出的验证码进行判断；如果不相等就return；结束方法

(2).利用request.getParamterMap()获取前台的数据
注意：这里不用设置编码集,项目中配置了字符过滤器
(3).将其封装成user对象[利用BeanUtils]
(4).调用service方法完成注册[传入一个对象,返回类型是boolean]

(5).对service方法返回的结果进行判断;[封装到一个对象中]
如果是true,则表示注册成功,将ResultInfo中的setFlag设置为true
如果是false,则表示注册失败,将ResultInfo中设置相对应的信息
(6).将封装的对象序列化为Json对象
(7).将json数据写回客户端
service层
(1).根据用户名查询用户对象

(2). 保存用户信息
2.1 设置激活码,要求唯一
2.2 设置激活状态
2.3 调用service方法进行用户保存

(3). 激活邮件发送:邮件正文
dao层
(1).根据用户名查询是否存在
(2).添加用户信息

• ②. 邮箱的激活
  

步骤：
activeServlet:
(1).获取激活码
(2).调用service完成激活
(3).判断标记
(4).响应浏览器
service层：
(1).根据激活码查询用户对象
(2).调用dao的修改激活转态的方法
dao层：

• ③ 登录
  

1.后台代码实现：
servlet
(1). 获取用户名和密码数据
(2). 封装user对象
(3). 调用service完成查询,返回一个User对象

(4). 根据service返回的user对象进行判断
4.1 账号密码错误
4.2 账号密码正确没有激活
4.3 账号密码正确激活了
(5). 将数据序列化为json
(6). 将json数据响应给浏览器
service层

dao层

2.前台代码编写
(1). 点击button登录按钮，触发一个点击事件
(2). 发送一个ajax，请求一个loginServlet
(3). 接收到后台的json格式的数据，进行操作

• ④. 姓名提示

前后台步骤：

• ⑤. 退出
  

前后台代码步骤：
注意：访问路径是 [ http://localhost:80/travel ]

2. day02[ BaseServlet抽取、分类id的显示、分页显示数据 ]

• ①.减少Servlet的数量，现在是一个功能一个Servlet，将其优化为一个模块一个Servlet，相当于在数据库中一张表对应一个Servlet，在Servlet中提供不同的方法，完成用户的请求

BaseServelt实现步骤：
(1).获取请求路径
(2).获取方法的名称
(3).获取方法对象method
(4).执行方法

注意事项：
(1).Idea控制台中文乱码解决：-Dfile.encoding=gb2312
(2).this的指向

• ②. 查询所有的分类数据展示

步骤：
service[重点]
servlet：
dao：
仿百度分页
/*
// 展示分页页码
1.一共展示10个页码，能够达到前5后4的效果
2.如果前边不够5个，后边补齐10个
3.如果后边不足4个，前边补齐10个
*/

3.day03[ 带查询的分页显示、旅游线路的详情 ]

• ①. 带查询的分页显示

前台代码的实现
参数传递[在Head.html中]
(1).给查询按钮绑定点击事件,获取输入框中的值
(2).点击查询的时候会将cid和rname两个参数带到location.href的后面
跳转路径http://localhost/travel/route_list.html?cid=5 拼接上rname=xxx

后台代码的实现：
servlet
service：
这里最重要的就是总记录数和每页显示的数据
dao：
(1).根据cid查找总记录数
(2).根据cid,start,pageSize 查询当前页的数据集合

• ②.详情页面展示
  

后台代码的实现
servlet
dao

CRUD

1. 列表查询

• ①. 用户点击 "查询所有用户 " 的超链接。跳转到Servlet中

• ②. 在Servlet中，调用service中的方法去查询所有的用户

• ③. 在service中调用dao的方法，去查询所有的用户信息

• ④. 在dao中去数据库中查询所有用户信息存入list集合，然后将list集合返回给service

List query(sql,new BeanPropertyRowMapper<>(User.class));

• ⑤. 在service中将dao返回的list集合数据，返回给servlet

• ⑥. 在servlet中将service返回的list集合，存入域中，然后跳转到一个list.jsp

• ⑦. 在list.jsp中从域中获取list集合，使用循环，然后展示到界面

2. 登录

• ①. 设置请求的编码request.setCharacterEncoding(“utf-8”);

• ②.获取图片生成的验证码和用户输入的验证码 (图片生成的验证码我们可以通过session拿到)

• ③.校验验证码（如果用户生产的验证码和用户输入的验证码不一样，失败，转发回登录页面，验证码正确，判断用户名和密码）

• ④. 通过getParameterMap（）和BeanUtils.populate（ ）封装user对象

• ⑤. 调用service进行查询，service调用dao层

• ⑥. 通过dao层访问数据库，将User对象返回给service，service返回给LoginServlet

queryForObject（sql,user.getUsername( ),user.getPassword）
注意：这里要用try-catch 因为必须查询出一条记录来

• ⑦. 如果User不为nul，表示登录成功，将User信息保存到Session域中，重定向到index.jsp页面

• ⑧. 如果User为null，表示登录失败，将User信息保存到Request域中，转发到登录页面

注意：
（1）.login.jsp如果没有错误信息.就不显示错误信息先关内容.

（2）.要去判断从session取出的checkcode是否为空.

3. 添加功能

update（sql,user.getName…）

• ①. 设置编码

• ②. 获取所有的数据

• ③. 封装对象

• ④. 调用service完成保存

• ⑤. 重定向到userListServlet，再次查询数据

4. 删除

• ①. 获取参数：id

• ②. 调用service – userDao（操作数据库）

• ③. 跳转查询所有Servlet

5. 修改

update(sql,user.getName()…)
注意事项：

• ①. 点击修改按钮，去请求一个servlet，根据id去获取用户的所有信息

• ②. 在这个servlet中，跳转到update.jsp .跳转的时候要将查询出来的所有信息携带过来

• ③. 在update.jsp 上回显要修改的用户信息（回显数据的时候，是不用显示数据库中的id）要用隐藏域去记录的id

• ④. 用户点击提交，将所有的信息提交到updateServlet上

• ⑤. 在servlet中，调用service – dao 去数据库中修改数据

• ⑥. 跳转到UserListServlet 中（查询数据库，将所有的用户信息都封装到list集合中，然后存入request域，然后转发到list.jsp）

6. 批量删除（全选）

• ①. 全选

步骤：
(1). 当点击父复选框的时候，触发一个点击事件
(2). 通过getElementsByTagName（）得到子复选框的数组
(3). 遍历子复选框的数组
(4). 将父选框.checked 赋值给 每一个子复选框

• ②. 删除选中条目的id(掌握)

前台步骤如下：
(1). 点击批量删除按钮，触发一个点击事件；
(2). 在列表显示数据外面套上一个form表单，用于提交数据
(3). 给出提示：是否进行批量删除的操作，如果是
(4).设置一个变量 var flag=false；用来表示是否有选中的框
(4). 通过getElementsByTagName( )得到每一个子复选框
(5). 遍历子复选框，要是有一个选中的，就把flag=true
(6). 如果flag=true 表示有选中的元素，则进行表单提交
(7). 如果flag=false 表示没有选中的元素，给出提示框提示没有选中元素

• ②. delSelectedServlet

后台步骤如下：
(1). 通过String [ ] ids=reuqest.getParameterMap(“userId”):获取选中的id
(2). 将ids数组作为参数传递到service
(3). 在service中进行健壮判断 if(ids!=null&&ids.length>0) 遍历ids，传递给dao层
(4). 在dao层中用JDBCTemplate.update(sql,id)进行删除
(5). 在delSelectedServlet中重定向到数据展示页面

7. 分页

• ①. 分页查询功能分析

分析：
(1).输入：浏览器（前台） ⇢ 服务器（后台）
a.要请求的页面currentPage
b.每页显示的条数（可选）rows
(2).输出：服务器（后台） ⇢ 浏览器（前台） PageBean
a.总的条目数（需要从数据库中查询到）
b.总页数，计算得来。countPage=Math.ceil(totalCount*1.0/rows)
c.当前页面展示的数据list
d.当前页码
e.每页显示的条目数 rows

• ②. 后台代码的分析和实现

分析：
Servlet
(1). 接收请求的参数currentPage、rows
(2). 调用service返回一个PageBean对象
(3). 将PageBean对象存入request域中
(4). 转发到list.jsp页面进行展示

UserService
(1). 创建一个PageBean对象,一次进行赋值
(2). 总条数totalAccount通过select count(*) from user 查询到
(3). 总页数：totalAccount/rows进行判断
(4). 每页显示的数据: select * from user limit ?,?
(5). 将PageBean对象返回
dao：操作数据库
(1). 查询总记录数
(2). 查询每页显示的数据

• ③. 前台代码的实现

具体实现：
1.列表显示和总条数、总页数

2.将下面分页条实现
(1). 头：如果当前页=1，就要把按钮进行禁用，在后台service层要将currentPage赋值为1
(2). 中间数据：如果当前页等于遍历的页数就激活,否则就不激活
(3). 尾部：如果当前页=最后一页（${pb.totalPage}），就把最后一页进行禁用，在后台service将currentPage=${pb.totalPage}

• ④. 注意的细节

细节：
(1).在servlet中，如果访问的是index.jsp不用带参数进来,或者是懂技术的人直接访问servlet,所以要进行健壮性判断
(2).在分页的头部，要在service中对其<=0的currentPage进行重新赋值
（3).今天出现新错误

8. 复杂的条件查询功能

• ①. 带分页的条件查询分析

分析：
（1）前台传递的参数有：输入框中的参数（name、address、email）、当前页（currentPage）、每页显示的行数（rows）
（2）这里最关心的两个参数是 totalCount 和 List user ；这里的两个sql一定是动态生成的

• ②. 后台代码的实现

步骤：
servlet：
(1).得到带条件分页的参数：
如果是点击查询按钮,不需要带上currentPage和rows,这里使用默认 ,map集合中没有这两个参数
如果是点击的分页条目,会带上currentPage和rows,map集合中有这两个参数
(2). 调用service对象,返回一个pageBean对象(带上了map集合参数)

(3). 将前台传递来的map保存到request域中,用于记住输入框中的数据
service
(1).设置总记录数(这里带条件查询的时候要带上模糊查询条件,要传入map)
(2).设置每页显示的数据(这里带条件分页查询的时候要带上模糊查询条件,也要传入map)

dao(掌握)
(1).查询总条数

(2).查询每页显示的数据

• ③. 前台代码实现

步骤：
(1).回写数据
(2).点击超链接带上分页查询的参数

1. 前提设置

项目创建：
（1）所有的jar包都必须放在web/WEB-INF/lib
（2）所有的静态资源都放在web下边

• 需求：用户信息的增删改查操作

• ①. 技术选型：Servlet+JSP+MySQL+JDBCTempleat+Duird+BeanUtilS+tomcat

• ②. 数据库设计：

create database day17; -- 创建数据库
	use day17; 			   -- 使用数据库
	create table user(   -- 创建表
		id int primary key auto_increment,
		name varchar(20) not null,
		gender varchar(5),
		age int,
		address varchar(32),
		qq	varchar(20),
		email varchar(50)
	);

• ③. 各种页面模板

//login
 

  
    
    
    
    

    
    
    
    
    
    
    
  
  
  	

  		
管理员登录
        

	      

	        用户名：
	        
	      
	      
	      

	        密码：
	        
	      
	      
	      

	        验证码：
	        
	        
	      
	      

	      

	        
	       
	  	
		
		
	  	

		  
		  	×
		   登录失败!
		
  	
  

//index.jsp
 

  
    
    
    
    

    
    
    
    
    
    
    
  
  
  

  	查询所有用户信息
	
  
  

//list
<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>





    
    
    
    
    
    
    
    

    
    
    
    
    
    
    



    
用户信息列表

    


        

            

                姓名
                
            
            

                籍贯
                
            

            

                邮箱
                
            
            查询
        

    

    


        添加联系人
        删除选中

    

    
            

        

            

            
编号
            
姓名
            
性别
            
年龄
            
籍贯
            
QQ
            
邮箱
            
操作
        

        

                

                
${s.count}
                
${user.name}
                
${user.gender}
                
${user.age}
                
${user.address}
                
${user.qq}
                
${user.email}
                
修改 删除
            

        


    
    

        

            

                

                    
                        «
                    
                
                
1
                
2
                
3
                
4
                
5
                

                    
                        »
                    
                
                
                    共16条记录，共4页
                

            
        
    

//insert





    
    
    
    
    
    
    
    

    
    
    
    
    
    



    
添加联系人页面
    

        

            姓名：
            
        

        

            性别：
            男
            女
        

        

            年龄：
            
        

        

            籍贯：
            
                广东
                广西
                湖南
            
        

        

            QQ：
            
        

        

            Email：
            
        

        

            
            
            
        
    

//update



    
    	
        
        
        
        
        

        
        
        
        
    
    
        

        
修改联系人
        

          

            姓名：
            
          

          

            性别：
              男
                女
          

          

            年龄：
            
          

          

            籍贯：
             
                广东
                广西
                湖南
            
          

          

            QQ：
            
          

          

            Email：
            
          

             

                
                
                
             
        
        
    

//CheckCodeServlet.java
package com.itheima.travel.web.servlet;

import java.awt.Color;
import java.awt.Font;
import java.awt.Graphics;
import java.awt.image.BufferedImage;
import java.io.IOException;
import java.util.Random;
import javax.imageio.ImageIO;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

/**
 * 验证码
 */
@WebServlet("/checkCode")
public class CheckCodeServlet extends HttpServlet {
	public void doGet(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {
		
		//服务器通知浏览器不要缓存
		response.setHeader("pragma","no-cache");
		response.setHeader("cache-control","no-cache");
		response.setHeader("expires","0");
		
		//在内存中创建一个长80，宽30的图片，默认黑色背景
		//参数一：长
		//参数二：宽
		//参数三：颜色
		int width = 80;
		int height = 30;
		BufferedImage image = new BufferedImage(width,height,BufferedImage.TYPE_INT_RGB);
		
		//获取画笔
		Graphics g = image.getGraphics();
		//设置画笔颜色为灰色
		g.setColor(Color.GRAY);
		//填充图片
		g.fillRect(0,0, width,height);
		
		//产生4个随机验证码，12Ey
		String checkCode = getCheckCode();
		//将验证码放入HttpSession中
		request.getSession().setAttribute("CHECKCODE_SERVER",checkCode);
		
		//设置画笔颜色为黄色
		g.setColor(Color.YELLOW);
		//设置字体的小大
		g.setFont(new Font("黑体",Font.BOLD,24));
		//向图片上写入验证码
		g.drawString(checkCode,15,25);
		
		//将内存中的图片输出到浏览器
		//参数一：图片对象
		//参数二：图片的格式，如PNG,JPG,GIF
		//参数三：图片输出到哪里去
		ImageIO.write(image,"PNG",response.getOutputStream());
	}
	/**
	 * 产生4位随机字符串 
	 */
	private String getCheckCode() {
		String base = "0123456789ABCDEFGabcdefg";
		int size = base.length();
		Random r = new Random();
		StringBuffer sb = new StringBuffer();
		for(int i=1;i<=4;i++){
			//产生0到size-1的随机值
			int index = r.nextInt(size);
			//在base字符串中获取下标为index的字符
			char c = base.charAt(index);
			//将c放入到StringBuffer中去
			sb.append(c);
		}
		return sb.toString();
	}
	public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		this.doGet(request,response);
	}
}