文章目录
  1. 1. Cookie
  2. 2. session cookie
  3. 3. cookie-session
  4. 4. signedCookie
  5. 5. Session
  6. 6. Storage类型
    1. 6.1. sessionStorage
    2. 6.2. localStorage
  7. 7. 参考文献

看过Cookie和Session的解析多次,但每次都是只站在前端的角度去看,缺少后端的使用经验,所以理解总是不到位,毕竟Cookie 和Session的多数操作都是在后端,所以对于Cookie和Session 的理解要前后端结合。
还有sessionStorage 和localStorage 这两个平日里也只是用来存储数据,对于我使用的场景到也都能实现,但他俩肯定是有区别的,不然有一个就够了啊。。。所以有了这篇笔记。。^_^

Cookie、Session等出现的原因就是为了克服http协议是个无状态协议的问题,这种缺点就导致了请求状态无法保持如用户的登录信息及个性化设置等。

Cookie 实现的思想就是服务器在http响应头中添加Set-Cookie信息,浏览器收到响应后会根据头中的字段保存cookie,下一次访问时在请求头中附带cookie内容,供服务器根据cookie值进行后续处理。

Cookie 是保存在浏览器终端内存或磁盘上的一小块数据,只能保存字符类型,所有的cookie信息都会随着浏览器的请求而发送。 cookie分为: 持久cookie,数据保存在磁盘中,会话cookie,数据保存在内存中,浏览器关闭后将被清除。

在Node + Express 4.x 中 使用 cookie-parser 模块。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
var http = require('http')
var express = require('express')
var app = express()
var router = express.Router()
var cookieParser = require('cookie-parser')
app.use(cookieParser())
app.use(express.static('./'))
app.all('*',function(req,res,next){
res.set({
'Content-Type': 'application/json',
'Access-Control-Allow-Origin':'*'
});
})
app.get('/ajax', function(req, res){
res.cookie('rememberme', '1', { expires: new Date(Date.now() + 900000000000)});
console.log(req.cookies)
res.send("hi...........");
})

这种情况在前后端不分离的情况下是可以发送Cookie成功的,即有app.use(express.static('./'))这个语句。

若是没有这个语句,经将页面改成前后端分离的情况,cookie是不能够发送到浏览器端的。出现这种情况的原因是同源策略。 虽然浏览器的CORS可以处理跨源请求,但是 默认情况下,跨源请求是不会携带凭据的(cookie,HTTP认证及客户端SSL证明)

若是在前后端分离的情况下若想发送Cookie,应在前端设置 xhr.withCredentials = true,后端设置Access-Control-Allow-Credentials : true 就可以进行发送Cookie了。。

在cookie-parser这个模块中的cookie设置主要有以下几点:

path:表示 cookie 影响到的路径,匹配该路径才发送这个 cookie。
expires 和 maxAge:告诉浏览器这个 cookie 什么时候过期,expires 是 UTC 格式时间,maxAge 是 cookie 多久后过期的相对时间。当不设置这两个选项时,会产生 session cookie,session cookie 是 transient 的,当用户关闭浏览器时,就被清除。一般用来保存 session 的 session_id。
secure:当 secure 值为 true 时,cookie 在 HTTP 中是无效,在 HTTPS 中才有效。
httpOnly:浏览器不允许脚本操作 document.cookie 去更改 cookie。一般情况下都应该设置这个为 true,这样可以避免被 xss 攻击拿到 cookie。

对于httpOnly 这点,通常Web页面内还可以对Cookie进行读取操作,但使用Javascript的document.cookie就无法读取附加HttpOnly 属性后的Cookie 内容了。因此也就无法在XSS中利用Javascript劫持Cookie了。

Cookie 只存在于当前标签页,在其他标签页中不存在,另外Cookie的生命周期取决于expires, 作用范围由domain 和 path决定。

Cookie 可用于多个页面。即两个窗口中是都可以有的。

Cookie 是可以自己独自使用的,不用和session同时使用就可以,但是因为session的使用会用到cookie,所以让我以为Cookie必定会用到session。

session_id 在 cookie 中的存储方式是 session cookie。即当浏览器一关闭,浏览器中 cookie 中的 session_id 字段就会消失。但是根据你设置的cookie的maxAge 或者expire ,存储在Application 下的Cookies中的session_id不一定会消失。因为cookie的生命周期取决于maxAge或者expire 和浏览器关闭无关。

我之前是没有搞清楚 session cookiecookie session然后特意问了下alsotang老师,老师解释 cookie-session 说的是 session 中的大量数据是存在 cookie 而非 redis 中。

signedCookie

cookie的缺点是明文存储在浏览器端容易被修改,假如根据什么算法把它加个密再存储就好了。在计算机领域,有个信息摘要算法,说的是在服务器端设置个秘密字符串,然后把本来要明文发送的cookie,在首部添加上这个秘密的字符串然后经过这个算法得到一堆加密的字符串,然后再存储在cookie中。

Session

cookie 的不安全的问题也有了session的出现。session 是一种服务器端的机制,服务器使用一种类似散列表的结构来保存信息。
session 中的数据是保留在服务器端的。session 的使用通过一个 session_id 来进行,session_id 通常是存放在客户端的 cookie 中。这个session_id是服务端随机产生一个 1024 比特长的字符串,位数足够长并且是随机的,所以比较安全。
我觉得 Session 和 signedCookie 类似的是 将存储在cookie 中的明文进行加密了。

Storage类型

Storage 类型提供最大的存储空间来存储键值对。 存在如下方法:

clear()
getItem(name)
key(index)
removeItem(name)
setItem(name,value)

Storage类型只能存储字符串。非字符串的数据在村吃之前会被转换成字符串。

sessionStorage

sessionStorage 存储的数据只能保持到浏览器关闭。 在页面刷新时保存的值仍存在,但是不能跨越多页面,cookie 可以。

localStorage

localStorage 用于持久的保存客户端数据。 要访问localStorage 对象,页面必须同源。 对于localStorage 数据会保留到JS 删除或者是用户清除浏览器缓存。

参考文献

  1. alsotang cookie 和 session
文章目录
  1. 1. Cookie
  2. 2. session cookie
  3. 3. cookie-session
  4. 4. signedCookie
  5. 5. Session
  6. 6. Storage类型
    1. 6.1. sessionStorage
    2. 6.2. localStorage
  7. 7. 参考文献