1、Cookie 饼干

a)什么是 Cookie?

1、Cookie 翻译过来是饼干的意思。
2、Cookie 是服务器通知客户端保存键值对的一种技术。
3、客户端有了 Cookie 后,每次请求都发送给服务器。
4、每个 Cookie 的大小不能超过 4kb

b)如何创建 Cookie

QQ截图20220326170417.png
Servlet 程序中的代码:

  1. protected void createCookie(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
  2. //1 创建 Cookie 对象
  3. Cookie cookie = new Cookie("key4", "value4");
  4. //2 通知客户端保存 Cookie
  5. resp.addCookie(cookie);
  6. //1 创建 Cookie 对象
  7. Cookie cookie1 = new Cookie("key5", "value5");
  8. //2 通知客户端保存
  9. Cookie resp.addCookie(cookie1);
  10. resp.getWriter().write("Cookie 创建成功");
  11. }

c)服务器如何获取 Cookie

服务器获取客户端的 Cookie 只需要一行代码:req.getCookies():Cookie[]
QQ截图20220326170658.png
Cookie 的工具类:

  1. public class CookieUtils {
  2. /**
  3. * 查找指定名称的 Cookie 对象
  4. *
  5. * @param name
  6. * @param cookies
  7. * @return
  8. */
  9. public static Cookie findCookie(String name, Cookie[] cookies) {
  10. if (name == null || cookies == null || cookies.length == 0) {
  11. return null;
  12. }
  13. for (Cookie cookie : cookies) {
  14. if (name.equals(cookie.getName())) {
  15. return cookie;
  16. }
  17. }
  18. return null;
  19. }
  20. }

Servlet 程序中的代码:

  1. protected void getCookie(HttpServletRequest req, HttpServletResponse resp) throws ServletException,
  2. IOException {
  3. Cookie[] cookies = req.getCookies();
  4. for (Cookie cookie : cookies) {
  5. // getName 方法返回 Cookie 的 key(名)
  6. // getValue 方法返回 Cookie 的 value 值
  7. resp.getWriter().write("Cookie[" + cookie.getName() + "=" + cookie.getValue() + "] <br/>");
  8. }
  9. Cookie iWantCookie = CookieUtils.findCookie("key1", cookies);
  10. //
  11. for (Cookie cookie : cookies) {
  12. //
  13. if ("key2".equals(cookie.getName())) {
  14. //
  15. iWantCookie = cookie;
  16. //
  17. break;
  18. //
  19. }
  20. //
  21. }
  22. // 如果不等于 null,说明赋过值,也就是找到了需要的 Cookie
  23. if (iWantCookie != null) {
  24. resp.getWriter().write("找到了需要的 Cookie");
  25. }
  26. }

d)Cookie 值的修改

方案一:
1、先创建一个要修改的同名(指的就是 key)的 Cookie 对象
2、在构造器,同时赋于新的 Cookie 值。
3、调用 response.addCookie( Cookie );

  1. // 方案一:
  2. // 1、先创建一个要修改的同名的 Cookie 对象
  3. // 2、在构造器,同时赋于新的 Cookie 值。
  4. Cookie cookie = new Cookie("key1","newValue1");
  5. // 3、调用 response.addCookie( Cookie ); 通知 客户端 保存修改
  6. resp.addCookie(cookie);

方案二:
1、先查找到需要修改的 Cookie 对象
2、调用 setValue()方法赋于新的 Cookie 值。
3、调用 response.addCookie()通知客户端保存修改

  1. //方案二:
  2. //1、先查找到需要修改的 Cookie 对象
  3. Cookie cookie = CookieUtils.findCookie("key2", req.getCookies());
  4. if(cookie!=null){
  5. //2、调用 setValue()方法赋于新的 Cookie 值。
  6. cookie.setValue("newValue2");
  7. //3、调用 response.addCookie()通知客户端保存修改
  8. resp.addCookie(cookie);
  9. }

注意:修改cookie的值最好先做BASE64处理,不然值就只能支持单纯的英文字符串

e)浏览器查看 Cookie:

QQ截图20220327155136.png
QQ截图20220327155213.png

f) Cookie 生命控制

Cookie 的生命控制指的是如何管理 Cookie 什么时候被销毁(删除)
setMaxAge()
正数,表示在指定的秒数后过期
负数,表示浏览器一关,Cookie 就会被删除(默认值是-1)
零,表示马上删除 Cookie

g)Cookie 有效路径 Path 的设置

Cookie 的 path 属性可以有效的过滤哪些 Cookie 可以发送给服务器。哪些不发。
path 属性是通过请求的地址来进行有效的过滤。
CookieA path=/工程路径
CookieB path=/工程路径/abc
请求地址如下:
http://ip:port/工程路径/a.html
CookieA 发送
CookieB 不发送

http://ip:port/工程路径/abc/a.html
CookieA 发送
CookieB 发送

h) Cookie 练习—-免输入用户名登录

QQ截图20220327185935.png

2、Session 会话

  1. 会话:一次会话中包含多次请求和响应
    注:一次会话表示浏览器第一次给服务器发送请求,会话建立,直到有一方断开为止
  2. 功能:在一次会话的多次请求间共享数据
  3. 方式:
    (1) 客户端会话技术:Cookie
    (2) 服务器端会话技术:Session

    i) 什么是 Session 会话?

    1、Session 就一个接口(HttpSession)。
    2、Session 就是会话。它是用来维护一个客户端和服务器之间关联的一种技术。
    3、每个客户端都有自己的一个 Session 会话。
    4、Session 会话中,我们经常用来保存用户登录之后的信息。

session是放在服务端,cookie是放在客户端

j) 如何创建 Session 和获取(id 号,是否为新)

如何创建和获取 Session。它们的 API 是一样的。
request.getSession()
第一次调用是:创建 Session 会话
之后调用都是:获取前面创建好的 Session 会话对象。

isNew(); 判断到底是不是刚创建出来的(新的)
true 表示刚创建
false 表示获取之前创建

每个会话都有一个身份证号。也就是 ID 值。而且这个 ID 是唯一的。
getId() 得到 Session 的会话 id 值。

session.getId();session.getCreationTime()

k)Session 域数据的存取

  1. protected void setAttribute(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
  2. req.getSession().setAttribute("key1","value1");
  3. resp.getWriter().write("已经往 Session 中保存了数据");
  4. }
  5. protected void getAttribute(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
  6. Object attribute = req.getSession().getAttribute("key1");
  7. resp.getWriter().write("从 Session 中获取出 key1 的数据是:"+attribute);
  8. }

l) Session 生命周期控制

public void setMaxInactiveInterval(int interval) 设置 Session 的超时时间(以秒为单位),超过指定的时长,Session就会被销毁。
值为正数的时候,设定 Session 的超时时长。
负数表示永不超时(极少使用)

public int getMaxInactiveInterval()获取 Session 的超时时间
public void invalidate() 让当前 Session 会话马上超时无效。

Session 默认的超时时长是多少!

Session 默认的超时时间长为 30 分钟。
因为在 Tomcat 服务器的配置文件 web.xml中默认有以下的配置,它就表示配置了当前 Tomcat 服务器下所有的 Session
超时配置默认时长为:30 分钟。

30

如果说。你希望你的 web 工程,默认的 Session 的超时时长为其他时长。你可以在你自己的 web.xml 配置文件中做以上相同的配置。就可以修改你的 web 工程所有 Seession 的默认超时时长。

  1. <!--表示当前 web 工程。创建出来 的所有 Session 默认是 20 分钟 超时时长-->
  2. <session-config>
  3. <session-timeout>20</session-timeout>
  4. </session-config>

如果你想只修改个别 Session 的超时时长。就可以使用上面的 API。setMaxInactiveInterval(int interval)来进行单独的设置。
session.setMaxInactiveInterval(int interval)单独设置超时时长。
Session 超时的概念介绍:
QQ截图20220330102710.png

  1. protected void life3(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
  2. // 先获取 Session 对象
  3. HttpSession session = req.getSession();
  4. // 设置当前 Session3 秒后超时
  5. session.setMaxInactiveInterval(3);
  6. resp.getWriter().write("当前 Session 已经设置为 3 秒后超时");
  7. }

Session 马上被超时示例:

  1. protected void deleteNow(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
  2. // 先获取 Session 对象
  3. HttpSession session = req.getSession();
  4. // 让 Session 会话马上超时
  5. session.invalidate();
  6. resp.getWriter().write("Session 已经设置为超时(无效)");
  7. }

m) 浏览器和 Session 之间关联的技术内幕

Session 技术,底层其实是基于 Cookie 技术来实现的。
QQ截图20220330110300.png
02.会话跟踪技术(1).png
明明session没有超时,为什么关闭浏览器后再打开就找不到了?
session底层的cookie的存活时间默认是session,浏览器一关cookie就没了。
Cookie/Session机制详解

3、项目第六阶段

3.1、登陆—-显示用户名

QQ截图20220403092722.png

3.2、登出—-注销用户

1、销毁 Session 中用户登录的信息(或者销毁 Session)
2、重定向到首页(或登录页面)。
QQ截图20220403092808.png

3.3、表单重复提交之——-验证码

表单重复提交有三种常见的情况:
一:提交完表单。服务器使用请求转来进行页面跳转。这个时候,用户按下功能键 F5,就会发起最后一次的请求。造成表单重复提交问题。解决方法:使用重定向来进行跳转
二:用户正常提交服务器,但是由于网络延迟等原因,迟迟未收到服务器的响应,这个时候,用户以为提交失败,就会着急,然后多点了几次提交操作,也会造成表单重复提交。
三:用户正常提交服务器。服务器也没有延迟,但是提交完成后,用户回退浏览器。重新提交。也会造成表单重复提交。
QQ截图20220403092935.png

3.4、谷歌 kaptcha 图片验证码的使用

谷歌验证码 kaptcha 使用步骤如下:
1、导入谷歌验证码的 jar 包
kaptcha-2.3.2.jar
2、在 web.xml 中去配置用于生成验证码的 Servlet 程序

  1. <servlet>
  2. <servlet-name>KaptchaServlet</servlet-name>
  3. <servlet-class>com.google.code.kaptcha.servlet.KaptchaServlet</servlet-class>
  4. </servlet>
  5. <servlet-mapping>
  6. <servlet-name>KaptchaServlet</servlet-name>
  7. <url-pattern>/kaptcha.jpg</url-pattern>
  8. </servlet-mapping>

KaptchaServlet类是kaptcha-2.3.2.jar 中的
3、在表单中使用 img 标签去显示验证码图片并使用它

  1. <form action="http://localhost:8080/temp/registServlet" method="get">
  2. 用户名:<input type="text" name="username"> <br>
  3. 验证码:<input type="text" style="width: 80px;" name="code">
  4. <img src="http://localhost:8080/temp/kaptcha.jpg" alt="" style="width: 100px; height: 28px;"> <br>
  5. <input type="submit" value="登录">
  6. </form>

4、在服务器获取谷歌生成的验证码和客户端发送过来的验证码比较使用。

  1. @Override
  2. protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
  3. // 获取 Session 中的验证码
  4. String token = (String) req.getSession().getAttribute(KAPTCHA_SESSION_KEY);
  5. // 删除 Session 中的验证码
  6. req.getSession().removeAttribute(KAPTCHA_SESSION_KEY);
  7. String code = req.getParameter("code");
  8. // 获取用户名
  9. String username = req.getParameter("username");
  10. if (token != null && token.equalsIgnoreCase(code)) {
  11. System.out.println("保存到数据库:" + username);
  12. resp.sendRedirect(req.getContextPath() + "/ok.jsp");
  13. } else {
  14. System.out.println("请不要重复提交表单");
  15. }
  16. }

切换验证码:

  1. // 给验证码的图片,绑定单击事件
  2. $("#code_img").click(function () {
  3. // 在事件响应的 function 函数中有一个 this 对象。这个 this 对象,是当前正在响应事件的 dom 对象
  4. // src 属性表示验证码 img 标签的 图片路径。它可读,可写
  5. // alert(this.src);
  6. this.src = "${basePath}kaptcha.jpg?d=" + new Date();
  7. });

QQ截图20220405110346.png
kaptcha详细参数:
QQ截图20220404092005.png

14尚硅谷_Cookie&Session王振国 - 课堂笔记.pdf