深入代码，理解cookie, seesion, token

最新推荐文章于 2023-08-02 15:13:23 发布

麦乐乐

最新推荐文章于 2023-08-02 15:13:23 发布

阅读量190

点赞数

分类专栏： node JavaScript专题

本文链接：https://blog.csdn.net/qq_41831345/article/details/104923458

版权

JavaScript专题同时被 2 个专栏收录

23 篇文章 0 订阅

订阅专栏

node

7 篇文章 0 订阅

订阅专栏

登陆场景理解Sesion和Cookie

cookie

服务端生成的，给浏览器保存，服务端不保存。每次请求时，需要带上这个cookie。

直接上代码，目录如下：

这个项目是mkdir cookie创建 - cd cookie - npm init - npm install express

新建app.js文件

设置一个cookie，名字和过期时间。

var express = require('express')
var app = express();
app.get('/',(req,res)=> {
    res.cookie('maile', 16, {
        maxAge: 14 * 86400 * 1000, // 14天的有效期
        httpOnly: true // js脚本无法读取cookie,能有效的防止xss脚本攻击 没有这个属性document.cookie可以获取cookie
    })
    res.send('首页')
})
app.listen(3000);

// cookie解决http无状态, 存在浏览器，不安全。服务端告诉浏览器，把这个cookie存下来
// session 存在服务器，
//Session：记录一系列状态, 不是 独立存在的，依赖于cookie。通常用于登陆验证

//Session与cookie功能效果相同。Session与Cookie的区别在于Session是记录在服务端的，而Cookie是记录在客户端的。

先把设置cookie的代码去掉，node app.js 访问locallhost:3000

这时会看到，请求头和响应头都是没有cookie的。再把设置cookie的代码加上，然后重启一下，刷新页面。

可以看到响应头中已经加入了cookie，但是请求头并没有带有cookie。这时再刷新一下页面，

可以看到两个地方都又cookie，之后的请求都会带上这个cookie。但是这样又缺点，就是cookie可以被修改。也不能存放敏感信息，不安全，另外，存放量不能太大。cookie不能单独用来做登陆验证，需要和session或者token配合使用。

session

session是保存在服务端的，服务端要给每个用户保存一个sessionId，而浏览器只需要保存自己的seeionId，这样就给服务器增加了负担。因为每个用户只需要存自己的sessionId，而服务器需要存所有用户的sessionId。

这里用koa来实现。

package.json需要装的插件装一下。

{
  "name": "cookie",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "express": "^4.17.1",
    "koa": "^2.11.0",
    "koa-route": "^3.2.0",
    "koa-router": "^8.0.8"
  },
  "devDependencies": {
    "koa-parser": "^1.0.8",
    "koa-session": "^5.13.1"
  }
}

新建一个koaApp.js

const Koa = require('koa');
const Route = require('koa-router');
const session = require('koa-session');
const static = require('koa-static');
const body = require('koa-parser')
let app = new Koa();
// 处理post
app.use(body());
let router = new Route()
app.keys = [
    'dhkjshafkd932402',
    'ieywoqyr8439743243',
    'jklfdsufiequ4353454'
]
app.use(session({
    maxAge: 20 * 24 * 6000, // 20分钟
    renew: true
}, app))
router.post('/login', async ctx => {
    var { username = '', password = '' } = ctx.request.body
    if(username === '麦乐' && password === '123456') {
        ctx.session.user = username;
        ctx.body = {
            code: '200'
        }
        console.log('登陆成功')
    } else {
        ctx.body = {
            code: '401'
        }
        console.log('登陆失败')
    }
    
})
router.get('/profile', async ctx => {
    if(!ctx.session.user) {
        ctx.body = `<a href='/'>请返回登陆</a>`
    }else {
        ctx.body = `用户中心`
    }
})
router.get('/logout', async ctx => {
    ctx.session.user = null
    ctx.body = `<a href='/'>请返回登陆</a>`
})
app.use(router.routes());
app.use(static(__dirname + '/static'))
app.listen(3000)

创建一个静态资源文件夹，存放html。这样访问localhost:3000，就可以直接访问到，index.html。

index.html


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="./js/Jquery.js"></script>
</head>
<body>
    <label>username: </label><input type="text" name="username">
    <label>password: </label><input type='password'  name="password">
    <button class="btn">登陆</button><a href="/profile">用户中心</a><a class="logout" href="/logout">退出</a>
</body>
<script>
    $(function() {
        
        $('.btn').click(function() {
            var username = $(':text').val();
            var password = $(':password').val();
            console.log(username, password)
            $.post('/login',{
                    username,
                    password
                },
                function(data) {
                    console.log(data)
                }
            )}
        )

    })
</script>
</html>

node koaApp.js

登陆会创建session,每次向服务端发送请求时，会带上这个session，如果前端把session存在了cookie,每次请求的时候会自动带上。如果存在了localstorage, 则需要拦截请求哪里设置一下cookie,把这个信息塞到cookie了。服务端会查有没有对应的session。如果有，就说明用户已经登陆，可以请求资源，没有就返回校验失败。

session的缺陷是，如果采用负载均衡分布式服务器，就可能会出现这样的情况：一个用户的session保存在a服务器上，但是却请求到了b服务器，就会获取不到用户信息。这样就需要在不同的服务器之间不同的复制seeion，会给服务器增加很大的负担。有人提议要把所有seeion放在一台机器上，这样就不用复制来复制去了，但是如果存储session的服务器挂了，那所有的用户都登陆不了了。为了解决上述的一些不足，就有了下面token的产生。

token

token是保存在客户端的，服务器不保存。这样就节省了空间。

登陆后，会生成一个token，保存头部，用户信息，签名。

服务器用一个只有服务器才知道的密钥，和一定的加密算法（目的是为了掩盖敏感信息），生产一个签名，发送客户端。
浏览器拿到后就可以存在本地，cookie或者sessionStorage。也跟session一样，请求带着这样token。
服务端拿到后再用自己的密钥和加密算法去解密，然后生成新的签名，跟token中带有的签名对比，作出登陆状态判断。安全，又可以采用分布式。

麦乐乐

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
0
评论
深入代码，理解cookie, seesion, token

cookie服务端生成的，给浏览器保存，服务端不保存。直接上代码，目录如下：这个项目是mkdir cookie创建 - cd cookie - npm init - npm install express新建app.js文件设置一个cookie，名字和过期时间。var express = require('express')var app = express();...
复制链接

扫一扫

专栏目录