[转]cookie、sesstion、localstorage、sesstionstorage的使用和区别

文章目录

基本概念
cookie详解
- 1、服务端写入cookie
- 2、客户端查看cookie
- 3、前端JS获取cookie
sesstion详解
- 1，服务端生成sesstion。
- 2，客户端查看sesstionId
localStorage的使用
sesstionStorage

基本概念

cookie，是在客户端（浏览器）存储少量数据的地方，通常用于存储用户数据。在客户端和服务端进行交互的时候，会携带cookie到服务器。默认情况下，退出浏览器，cookie会被清除，但是cookie你可以给设置一个过期时间，在这个时间之前，cookie都不会被清除。
sesstion，是在服务端存储数据，保持用户会话的一种技术，通常用于客户端和服务端的通信。sesstion会在客户端的cookie中，存储一个sesstionid，每次发送请求的时候，会把这个sesstionid携带过去。在没有用户操作的情况下，sesstion会默认存储30分钟的数据，过期之后，需要重新获取sesstion。
localstorage，一种纯前端的存储数据的方式，存储数据量远远大于cookie。localstorage中的数据存储，和服务端完全没有任何关系。localstorage没有过期时间，只能手动调用相关API进行清除。
sesstionstorage，也是一种纯前端的数据存储方式，不过这个sesstionstorage，仅仅是在浏览器打开的状态下的临时数据存储，当浏览器刷新，关闭时，存储的数据会丢失。

cookie详解

在一个网页登陆的时候，调用登陆接口，服务端在返回数据的时候，会忘cookie中写入用户信息。以后的每次接口请求，都会自动携带这个cookie信息。

在前端，使用js也能获取当前域名下的cookie信息，获取到的cookie是一个字符串，基本语法是：

let cookie = document.cookie;

1、服务端写入cookie

我们服务端的核心代码如下：

Cookie cookie = new Cookie("user", "admin");
response.addCookie(cookie);

cookie是在服务端实例化一个Cookie类得到的。在响应中response.addCookie()方法进行添加cookie。

一个完整的servlet实例如下：

package com.ipackage.servlet;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;
import java.io.IOException;/*** Created by mapbar_front on 2019/8/1.*/
@WebServlet("/cookie")
public class CookiesServlet extends HttpServlet {protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {}protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {System.out.println("用户登陆成功");Cookie cookie = new Cookie("user", "admin");response.addCookie(cookie);response.getWriter().println("login sucess");}
}

2、客户端查看cookie

在浏览器中访问http://localhost:8080/cookie，就可以看到相应的请求信息。

显而易见，cookie是存储在客户端的。

3、前端JS获取cookie

console.log(document.cookie);
// "user=admin"

浏览器能够获取当前的cookie，证明我们的cookie其实是一种不安全的交互方式。基于这种保存用户信息的缺陷，出现了sesstion用户会话技术。

sesstion详解

正常情况下，打开一个浏览器窗口，向服务端请求资源，服务端就会生成一个对应于当前浏览器的唯一的sesstionId，这个sesstionId会存储在客户端的cookie中，每次请求，把这个sesstionId携带到服务端，服务端就能判断当前浏览器对应哪一个用户了。

这里要切记，每次打开新的浏览器窗口，都会生成新的sesstionId，浏览器窗口和sesstion一一对应，这是保证用户数据安全的核心部分。

1，服务端生成sesstion。

核心代码：

HttpSession session = request.getSession();
session.setAttribute("name", "张三");
String sesstionId = session.getId();

生成sesstionId的一个示例：

package com.imooc.servlet.session;import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import java.io.IOException;/*** Created by mapbar_front on 2019/8/1.*/
@WebServlet("/sesstion/login")
public class SesstionLoginServlet extends HttpServlet {protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {}protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {HttpSession session = request.getSession();session.setAttribute("name", "张三");String sesstionId = session.getId();System.out.println(sesstionId);request.getRequestDispatcher("/sesstion/index").forward(request, response);}
}

2，客户端查看sesstionId

在浏览器输入http://localhost:8080/sesstion/login

得到如下的结果：

localStorage的使用

不同于cookie和sesstion，localStorage是纯前端的存储数据的方式。

localStorage.setItem("user", "mapbar_front");

执行了上面的语句，你在你的控制台中的Application中看到刚刚设置的LocalStorage。

一般而言，存储的数据，还需要读取，使用的Api如下：

localStorage.getItem("user"); // "mapbar_front"

localStorage在不清除的情况下，哪怕关闭浏览器，还是会得到信息，是持久存储的。

sesstionStorage

sesstionStorage和localStorage的基本Api是一样的，唯一的区别就是，localStorage是持久存储的，而它自己是临时存储的，在同一域名下，关闭浏览器，sesstionStorage就会丢失数据。

sessionStorage.setItem("user", "mapbar_front");

获取方式，和localStorage一样。

sesstionStorage.getItem("user");
// "mapbar_front"

[转]cookie、sesstion、localstorage、sesstionstorage的使用和区别相关推荐

cookie html5,HTML5——存储（cookie、localStorage、sessionStorage）的区别
cookie 本来用于客户端和服务端通信, 但是因为它有本地存储的功能,于是被"借用"了. 使用方法 document.cookie 获取和修改即可缺点存储量太少,只有4kb ...
cookie、localStorage和sessionStorage三者的区别
cookie.localstorage和sessionStorage三者都是在开发中用到的临时存储客户端会话信息或者数据的方法,下面就简单介绍一下三者的区别: 一.存储的时间有效期不同 1.cooki ...
用cookie和localStorage存储登录信息的区别
前几天面试问项目时问到了为什么用localStorage存储登录信息不用cookie,做项目的时候确实没有想过为什么,只是因为localStorage这个api用起来方便,cookie还要自己封装,于 ...
session,cookie,sessionStorage,localStorage的区别及应用场景
浏览器的缓存机制提供了可以将用户数据存储在客户端上的方式,可以利用cookie,session等跟服务端进行数据交互. 一.cookie和session cookie和session都是用来跟踪浏览器 ...
彻底理解cookie,session,localStorage(附代码)
2019独角兽企业重金招聘Python工程师标准>>> 1. cookie 1.1 什么是cookie cookie 是存储于访问者的计算机中的变量.每当同一台计算机通过浏览器请求某 ...
用cookie实现localstorage功能
在项目中需要利用到html5的localstorage.但在利用这个属性的时候却发现无法达到预定目标.经过不断的检查及排除,最后发现原因所在: 项目中使用的浏览器是支持localstorage的,但是 ...
cookie对比localStorage哪个适合作为网站皮肤存储
cookie对比localStorage哪个适合作为网站皮肤存储 cookie cookie : 一般由服务器生成,可设置失效时间.如果在浏览器生成,默认是关闭浏览器之后失效存储大小:4k 每次都会 ...
“约见”面试官系列之常见面试题第十二篇之cookie和localstorage（建议收藏）
目录 1.cookie (1)什么是cookie (2)通过JavaScript创建cookie 2.localStorage和sessionStorage 使用相同的API 3.cookie.loc ...
前端存储之cookie、localStorage、sessionStorage、indexDB
cookie Cookie 是小甜饼的意思.顾名思义,cookie 确实非常小,它的大小限制为4KB左右,是网景公司的前雇员 Lou Montulli 在1993年3月的发明.它的主要用途有保存登录信 ...

[转]cookie、sesstion、localstorage、sesstionstorage的使用和区别

文章目录

基本概念

cookie详解

1、服务端写入cookie

2、客户端查看cookie

3、前端JS获取cookie

sesstion详解

1，服务端生成sesstion。

2，客户端查看sesstionId

localStorage的使用

sesstionStorage

[转]cookie、sesstion、localstorage、sesstionstorage的使用和区别相关推荐

最新文章

热门文章