cookie web存储 sessionStorage 三者的区别

cookie的使用（node）

第一步 安装cookie-parser yarn add cookie-parser --save / npm install cookie-parser --save

使用

    // 引入cookie-parser
    var express = require('express');
    var app = express();
    var cookieParser = require('cookie-parser');
    app.use(cookieParser('string')) // 传入的字符串可以作用加密模式使用
    app.get('/', function(req, res) {
        // 设置cookie
        // maxAge cookie过期时间 以毫秒数的形式表现
        res.cookie('name', "要存储的数据", {
            maxAge: 1000,//过期时间 以毫秒数的形式表现
            signed: false, // false表示设置cookie不适用加密 反之则进行加密
            expires: Date, // 也是cookie的过期时间 他是以日期的形式表现
            path: '', // 设置可以获取cookie的路径
            domain: '' // 设置可以获取cookie的第二域名
        })
    })

web存储

• localStorage

    // 设置存储的数据的方法 第一个参数是要存储的数据的名称-名称可以自定义 第二个参数是要存储的数据
    // 当存储的数据的数据类型是引用类型时 要使用json的形式保存数据
    var obj = {
        name: "李狗蛋儿"
    }
    localStorage.setItem('name', JSON.stringify(obj))

    // 获取localStorage的数据的方法 参数是要获取的存储数据的名称
    // 当要获取的数据还未存储时获取到的值是null
    var data = localStorage.getItem('name')
    console.log(data) // { "name": "李狗蛋儿" }
    // 清除web存储的方法 clear 会清除所以的web存储数据
    // localStorage.clear()
    localStorage.removeItem('name') // 指定要删除的存储数据
    

• sessionStorage

    // 设置存储的数据的方法 第一个参数是要存储的数据的名称-名称可以自定义 第二个参数是要存储的数据
    // 当存储的数据的数据类型是引用类型时 要使用json的形式保存数据
    var obj = {
        name: "李狗蛋儿"
    }
    sessionStorage.setItem('name', JSON.stringify(obj))

    // 获取localStorage的数据的方法 参数是要获取的存储数据的名称
    // 当要获取的数据还未存储时获取到的值是null
    var data = sessionStorage.getItem('name')
    console.log(data) // { "name": "李狗蛋儿" }
    

三者的区别

• cookie 存储空间只有4k cookie存储的数据可以再服务端和客户端穿梭 而且cookie可以设置要使用的路径、过期时间 、能使用cookie的域名等等

• localStorage 存储空间相对较大 有5兆左右 存储的数据没有时间限制 除非手动清除 他是用于客户端

• sessionStorage 存储的数据会在浏览器关闭 或者 当前页签关闭时清除 存储空间相对较大 有5兆左右