思考 如何使用cookie实现自动登录功能 2016年4月8日
学习
0 条评论

简单模拟。

一、思路

（1）写一个简单的表单提交，用来设置cookie的值

1
2
3
4
5
6
7
8
9
10
11
12
13
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<form action="cookie" method="get">
name:<input type="text" name="name">
    <input type="submit" value="login">
</form>
</body>
</html>

（2）写一个servlet，用来返回cookie值

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
package cookie;
 
import java.io.IOException;
import java.io.PrintWriter;
 
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.Cookie;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
 
@WebServlet("/cookie")
public class cookie extends HttpServlet {
 
PrintWriter pw = null;
 
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
 
req.setCharacterEncoding("utf-8");
String name = req.getParameter("name");
if (name != null && !name.trim().equals("")) {
 
Cookie cookie = new Cookie("cookie", name);
cookie.setMaxAge(60 * 5);
resp.addCookie(cookie);
} else {
Cookie[] cookies = req.getCookies();
if (cookies != null && !cookies.equals("")) {
for (Cookie cookie : cookies) {
String cookiename = cookie.getName();
if ("cookie".equals(cookiename)) {
String value = cookie.getValue();
name = value;
}
}
}
}
 
if (name != null && !name.trim().equals("")) {
pw = resp.getWriter();
pw.println("i am " + name);
} else {
resp.sendRedirect("4.10login.html");
}
// resp.sendRedirect("4.10index.html");
}
}

实验效果：

如果在没有cookie的情况下访问这个页面，将直接重定向到登录页面。

如果在有cookiename = cookie的情况下访问这个页面，则会显示 i am cookie-value。

（3）那么纯静态页面（无表单）怎么正确处理cookie，实现自动登录呢？

需要使用jquery的一个插件，jquery.cookie.js：http://plugins.jquery.com/cookie/

写一个页面：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>test</title>
    <script src="jquery-2.1.4.min.js"></script>
    <script src="jquery.cookie.js"></script>
</head>
<body>
<h1 id="test">i am index</h1>
<p id="cookie">cookie value</p>
<button onclick="sendcookie()">submit</button>
<button onclick="getcookie()">get cookie</button>
<script>
    function sendcookie(){
        var url = "cookie";
        $.post(url,function(data){
            $("#test").html("success");
        })
    }
 
    function getcookie(){
        var cookievalue = $.cookie("cookie");
        if(cookievalue == null){
            $("#cookie").html("no cookie exist");
        }else{
            $("#cookie").html(cookievalue);
        }
    }
</script>
</body>
</html>

改写servlet：

1
2
3
4
5
6
7
8
if (name != null && !name.trim().equals("")) {
pw = resp.getWriter();
pw.println("i am " + name);
} else {
resp.sendRedirect("4.10login.html");
}
resp.sendRedirect("4.10index.html");

实现效果：

按下get cookie可以获取cookie name为cookie的值：

可以发现，只要浏览器有了cookie之后，每次访问服务器就会带上这个cookie，自动登录可以通过这个道理实现。

cookie的流程大致如下：

  1. 浏览器没cookie。
  2. 第一次访问服务器。
  3. 服务器根据各种条件生成一个/n个cookie。
  4. 返回信息给浏览器，同时返回cookie。
  5. 浏览器根据cookie种类不同保存cookie。
  6. 浏览器有cookie。
  7. 浏览器带上cookie第二次访问服务器。
  8. 服务器获取cookie进行各种操作。

那么自动登录的流程就是稍微加强一下：

  1. 浏览器没cookie。
  2. 第一次提交账号密码表单访问服务器。
  3. 服务器根据各种条件(账号，邮箱…)加密生成一个/n个登录验证cookie。
  4. 返回信息给浏览器，同时返回cookie。
  5. 浏览器根据cookie种类不同保存cookie。
  6. 浏览器有cookie。
  7. 浏览器带上登录验证cookie第二次访问服务器。
  8. 服务器获取登录验证cookie，服务器获取账号信息(有可能通过cookie获得账号之类的东西)加密，进行比对。
  9. 正确，直接返回登录状态。
  10. 错误，返回到登录页面，需要重新登录获取cookie。

大概就是这个样子…

二、总结

之后将会提供具体实现方法。

Post Views: 108