node中的cookie的具体使用


Posted in Javascript onSeptember 13, 2018

为什么需要cookie

我们知道http是无状态的协议,无状态是什么意思呢?

我来举一个小例子来说明:比如小明在网上购物,他浏览了多个页面,购买了一些物品,这些请求在多次连接中完成,如果不借助额外的手段,那么服务器是不知道他到底购买了什么的,因为服务器压根就不知道每次请求的到底是不是小明,除非小明有一个标识来证明他是小明。

所以,网站为了辨别用户身份,进行 session 跟踪,cookie出现了。

cookie是什么

简单来说,cookie就是标识。

严格来说,cookie是一些存储在客户端的信息,每次连接的时候由浏览器向服务器递交,服务器也向浏览器发起存储 Cookie 的请求,依靠这样的手段,服务器可以识别客户端。

具体来说,浏览器首次向服务器发起请求时,服务器会生成一个唯一标识符并发送给客户端浏览器,浏览器将这个唯一标识符存储在 Cookie 中,之后每次发起的请求中,客户端浏览器都会向服务器传送这个唯一标识符,服务器通过这个唯一标识符来识别用户。

说了这么多,打开浏览器,我们先来看看这货吧。

node中的cookie的具体使用

上图中,就是浏览器中存的一个cookie,他的名字叫name,值为abc。

常规cookie

光看不过瘾,接下来,用node动手来做一个常规cookie吧。

首先,安装express框架和cookieParser中间件

npm i express --save
npm install cookie-parser --save

cookieParser中间件的主要用途如下:

  1. 解析来自浏览器的cookie,放到req.cookies中;
  2. 针对签名cookie,对cookie签名和解签

代码如下:

var express = require('express');
var cookieParser = require('cookie-parser');

var app = express();
app.use(cookieParser());

app.use(function (req, res) {
 if (req.url === '/favicon.ico') {
 return
 }

 // 设置常规cookie, 有效期为20s, 客户端脚本不能访问它的值
 res.cookie('name', 'abc', { signed: false, maxAge: 20 * 1000, httpOnly: true });
 console.log(req.cookies, req.url, req.signedCookies);

 res.end('hello cookie');
})

app.listen(4000)

运行后,在浏览器中打开 http://localhost:4000/

以chrome为例,f12打开浏览器调试工具,在application中的cookies中便能发现你定义的cookie。

req.cookies和req.signedCookies属性是随http请求发送过来的请求头中的Cookie的解析结果。

其中,req.cookies对应的是普通cookie,req.signedCookies对应的是签名cookie。

如果请求中没有cookie,这两个对象都是空的。

签名cookie

签名cookie更适合敏感数据,因为用它可以验证cookie数据的完整性,有助于防止中间人攻击。

有效的签名cookie放在req.signedCookies对象中。

代码如下:

var express = require('express');
var cookieParser = require('cookie-parser');

var app = express();

// 设置密钥,用来对cookie签名和解签, Express可以由此确定cookie的内容是否被篡改过
app.use(cookieParser('a cool secret'));

app.use(function (req, res) {
 if (req.url === '/favicon.ico') {
 return
 }

 // 设置签名cookie, 并且有效期为1min
 res.cookie('name', 'efg', { signed: true, maxAge: 60 * 1000, httpOnly: true });
 console.log(req.cookies, req.url, req.signedCookies);

 res.end('signed cookie');
})
app.listen(4000)

运行后,在浏览器中打开 http://localhost:4000/

以chrome为例,f12打开浏览器调试工具,在application中的cookies中便能发现你定义的签名cookie,格式如下:s%3Aefg.7FJDuO2E9LMyby6%2Bo1fGQ3wkIHGB9v1CDVWod8NQVAo

.号左边是cookie的值,右边是服务器上用SHA-1 HMAC生成的加密哈希值。

如果这个签名cookie的值被篡改,那么服务器上对cookie的解签会失败,在node中输出的req.signedCookies将为false。如下:

node中的cookie的具体使用

而如果cookie完好无损地传上来,那么将会被正确解析:

node中的cookie的具体使用

总结

你可以在cookie中存放任意类型的文本数据,但通常是在客户端存放一个会话cookie,这样你就能在服务器端保留完整的用户状态。

session

session和基于cookie的。 存在于服务器,相对cookie安全,但session也存在session劫持的风险, 所以需要一串很长很多的秘钥数组来增加破解的难度。同时设置manAge过期时间, 减少留给坏人破解时间。

node中有的中间件 是cookie-session

const express = require('express');
const cookieParser = require('cookie-parser');
const cookieSession = require('cookie-session');

var app = express();
app.use(cookieParser());

//cookieSession 必须放在cookieParser后面
app.use(cookieSession({
 //session的秘钥,防止session劫持。 这个秘钥会被循环使用,秘钥越长,数量越多,破解难度越高。
 keys: ['aaa', 'bbb', 'ccc'],
 //session过期时间,不易太长。php默认20分钟
 maxAge: 60*60,
 //可以改变浏览器cookie的名字
 name: 'session'
}));

app.use('/', function (req, res) {

 //假设使用count记录用户访问的次数
 if(req.session['count'] == null) {
  req.session['count'] = 1;
 }else{
  req.session['count']++;
 }
 console.log(req.session['count'])
 res.send('ok')
})
app.listen(8080)

//删除 delete req.session

浏览器中可以看到,服务器通过respond的set-cookie返回cookie

node中的cookie的具体使用

session是返回的cookie ID, session.sig 是session签名,作用是知道session是否被修改过

node中的cookie的具体使用

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js 鼠标拖动对象 可让任何div实现拖动效果
Nov 09 Javascript
js中将URL中的参数提取出来作为对象的实现代码
Aug 16 Javascript
jQuery 阴影插件代码分享
Jan 09 Javascript
jquery自定义属性(类型/属性值)
May 21 Javascript
利用js 进行输入框自动匹配字符的小例子
Jun 29 Javascript
用JavaScript显示浏览器客户端信息的超相近教程
Jun 18 Javascript
json与jsonp知识小结(推荐)
Aug 16 Javascript
学习Angular中作用域需要注意的坑
Aug 17 Javascript
jQuery插件autocomplete使用详解
Feb 04 Javascript
javascript滚轮事件基础实例讲解(37)
Feb 14 Javascript
node.js基于fs模块对系统文件及目录进行读写操作的方法详解
Nov 10 Javascript
jQuery实现全选按钮
Jan 01 jQuery
vue动态改变背景图片demo分享
Sep 13 #Javascript
vue vue-Router默认hash模式修改为history需要做的修改详解
Sep 13 #Javascript
详解如何在微信小程序开发中正确的使用vant ui组件
Sep 13 #Javascript
详解React中传入组件的props改变时更新组件的几种实现方法
Sep 13 #Javascript
vue 刷新之后 嵌套路由不变 重新渲染页面的方法
Sep 13 #Javascript
解决vuejs项目里css引用背景图片不能显示的问题
Sep 13 #Javascript
Vue-不允许嵌套式的渲染方法
Sep 13 #Javascript
You might like
PHP资源管理框架Assetic简介
2014/06/12 PHP
php使用fgetcsv读取csv文件出现乱码的解决方法
2014/11/08 PHP
php微信公众平台开发(三)订阅事件处理
2016/12/06 PHP
浏览器脚本兼容 文本框中,回车键触发事件的兼容
2010/06/21 Javascript
Jquery截取中文字符串的实现代码
2010/12/22 Javascript
JS函数实现动态添加CSS样式表文件
2012/12/15 Javascript
图片无缝滚动代码(向左/向下/向上)
2013/04/10 Javascript
打造个性化的功能强大的Jquery虚拟键盘(VirtualKeyboard)
2014/10/11 Javascript
jquery+php实现搜索框自动提示
2014/11/28 Javascript
JS或jQuery获取ASP.NET服务器控件ID的方法
2015/06/08 Javascript
利用jQuery中的ajax分页实现代码
2016/02/25 Javascript
jquery过滤特殊字符',防sql注入的实现方法
2016/08/17 Javascript
Javascript动画效果(4)
2016/10/11 Javascript
Bootstrap Table使用心得总结
2016/11/29 Javascript
基于vue+ bootstrap实现图片上传图片展示功能
2017/05/17 Javascript
JS实现匀加速与匀减速运动的方法示例
2017/09/04 Javascript
Vue基于NUXT的SSR详解
2017/10/24 Javascript
使用sessionStorage解决vuex在页面刷新后数据被清除的问题
2018/04/13 Javascript
微信小程序实现点赞、取消点赞功能
2018/11/02 Javascript
微信小程序实现人脸识别登陆的示例代码
2019/04/02 Javascript
vue实现输入框的模糊查询的示例代码(节流函数的应用场景)
2019/09/01 Javascript
微信小程序如何实现radio单选框单击打勾和取消
2020/01/21 Javascript
JS获取一个字符串中指定字符串第n次出现的位置
2021/02/10 Javascript
跟老齐学Python之玩转字符串(1)
2014/09/14 Python
详谈Python中列表list,元祖tuple和numpy中的array区别
2018/04/18 Python
python3 requests中使用ip代理池随机生成ip的实例
2018/05/07 Python
用python爬取租房网站信息的代码
2018/12/14 Python
Python中调用其他程序的方式详解
2019/08/06 Python
使用Pandas将inf, nan转化成特定的值
2019/12/19 Python
Html5实现用户注册自动校验功能实例代码
2016/05/24 HTML / CSS
军训生自我鉴定范文
2013/12/27 职场文书
校园十佳歌手策划书
2014/01/22 职场文书
活动宣传策划方案
2014/05/23 职场文书
贫困生助学金感谢信
2015/01/21 职场文书
2015年护士节活动总结
2015/02/10 职场文书
代理词怎么写
2015/05/25 职场文书