cookie的功能多用于登录中。
由于HTTP协议本身无状态,默认情况下HTTP协议的客户端和服务器之间的这次通信,和下次通信之间没有直接的联系.
而在登录之后,会跳转界面,这个界面需要记住你的登录信息才会返回特定的界面,所以就诞生了 Cookie 来记住登录信息。
就像去医院有就诊卡一样,这张卡上有很多患者的身份信息,刷这个卡的时候就能获取患者的一系列信息。
这个就诊卡就像Cookie。
医院的服务器上存放着用户的信息,也就是通过 session 方式存储的。
由于服务器同一时刻会收到很多请求,为了区分他们,需要设置 sessionId ,再将 sessionId 与用户对应起来。
会话就像“哈希表”,存储了很多键值对,key就是 sessionId ,value就是用户信息
流程:
~ 用户登录后,服务器会在 session 中新增一个记录,并把 sessionId传给客户端
~ 客户端后续发请求后,需要在请求中带上sessionId
~ 服务器收到请求后,根据 sessionId 获取到 session 中的信息后就会进 行后续操作
这里来一个登录的案例:
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
//在读取查询字符串的时候有可能是中文,所以要设置读取格式为utf8
req.setCharacterEncoding("utf8");
//按照utf8构造请求
resp.setCharacterEncoding("utf8");
//1、获取请求中的参数
String username = req.getParameter("username");
String password = req.getParameter("password");
if (username == null || "".equals(username) || password == null || "".equals(password)){
resp.setContentType("text/html");
resp.getWriter().write("当前用户名或密码为空!");
return;
}
//2、和数据库中的内容进行比较
UserDao userDao = new UserDao();
User user = userDao.selectByName(username);
if (user == null || !user.getPassword().equals(password)){
//用户没有查到或者密码不匹配
resp.setContentType("text/html");
resp.getWriter().write("用户名或密码错误!");
return;
}
//都正确,创建会话
HttpSession session = req.getSession(true);
//把用户信息存储到会话中
session.setAttribute("user", user);
//4、返回重定向报文,跳转页面
resp.sendRedirect("index.html");
}
我们还可以利用 session 来对应页面的登录状态
//用于让前端检测当前登录状态
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
resp.setContentType("application/json;charset=utf8");
HttpSession session = req.getSession(false);
if (session == null){
//检查会话是否存在,不存在就说明未登录!
User user = new User();
//这里的user如果没赋值,会有默认值
resp.getWriter().write(objectMapper.writeValueAsString(user));
return;
}
User user = (User)session.getAttribute("user");
if (user == null){
//虽然有对象,但是会话里没有user对象
user = new User();
resp.getWriter().write(objectMapper.writeValueAsString(user));
return;
}
//已经登录
//但这里不要返回密码
user.setPassword("");
resp.getWriter().write(objectMapper.writeValueAsString(user));
}
在后端返回用户信息后,前端通过ajax来获取,来进行接下来的判断:
// 加上一个逻辑, 通过 GET /login 这个接口来获取下当前的登录状态~
function getUserInfo() {
$.ajax({
type: 'get',
url: 'login',
success: function(body) {
// 判定此处的 body 是不是一个有效的 user 对象(userId 是否非 0)
if (body.userId && body.userId > 0) {
// 登录成功!
// 不做处理!
console.log("当前用户登录成功! 用户名: " + body.username);
} else {
// 登录失败!
// 让前端页面, 跳转到 login.html
alert("当前您尚未登录! 请登录后再访问博客列表!");
location.assign('login.html');
}
},
error: function() {
alert("当前您尚未登录! 请登录后再访问博客列表!");
location.assign('login.html');
}
});
}
谢谢你看到这,一起加油ヽ( ̄ω ̄( ̄ω ̄〃)ゝ