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 drag拖动代码
Dec 09 Javascript
JS trim去空格的最佳实践
Oct 30 Javascript
jQuery页面加载初始化常用的三种方法
Jun 04 Javascript
js实现字符串转日期格式的方法
May 20 Javascript
three.js实现围绕某物体旋转
Jan 25 Javascript
JS实现简易刻度时钟示例代码
Mar 11 Javascript
Bootstrap学习笔记 轮播(Carousel)插件
Mar 21 Javascript
微信小程序实现倒计时60s获取验证码
Apr 17 Javascript
redux-saga 初识和使用
Mar 10 Javascript
vue生命周期实例小结
Aug 15 Javascript
文章或博客自动生成章节目录索引(支持三级)的实现代码
May 10 Javascript
Vue 实例中使用$refs的注意事项
Jan 29 Vue.js
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实现二维数组(或多维数组)转换成一维数组的常见方法总结
2019/12/04 PHP
Jquery替换已存在于element上的event的方法
2010/03/09 Javascript
Jquery ThickBox插件使用心得(不建议使用)
2010/09/08 Javascript
ASP.NET jQuery 实例16 通过控件CustomValidator验证RadioButtonList
2012/02/03 Javascript
JS阻止事件冒泡行为和闭包的方法
2016/06/16 Javascript
jQuery树形控件zTree使用小结
2016/08/02 Javascript
在线引用最新jquery文件的实现方法
2016/08/26 Javascript
Angularjs实现带查找筛选功能的select下拉框示例代码
2016/10/04 Javascript
关于Iframe父页面与子页面之间的相互调用
2016/11/22 Javascript
微信小程序 解决swiper不显示图片的方法
2017/01/04 Javascript
js实现动态显示时间效果
2017/03/06 Javascript
javascript+html5+css3自定义提示窗口
2017/06/21 Javascript
Angular5集成eventbus的示例代码
2018/07/19 Javascript
解决webpack+Vue引入iView找不到字体文件的问题
2018/09/28 Javascript
angularJs中$scope数据序列化的实例
2018/09/30 Javascript
js回溯法计算最佳旅行线路代码实例
2019/09/11 Javascript
vue组件库的在线主题编辑器的实现思路
2020/04/03 Javascript
vue 解决在微信内置浏览器中调用支付宝支付的情况
2020/11/09 Javascript
python3+PyQt5实现自定义分数滑块部件
2018/04/24 Python
解决Python3 被PHP程序调用执行返回乱码的问题
2019/02/16 Python
PyCharm搭建Spark开发环境实现第一个pyspark程序
2019/06/13 Python
用python做游戏的细节详解
2019/06/25 Python
python爬虫开发之PyQuery模块详细使用方法与实例全解
2020/03/09 Python
Python如何发送与接收大型数组
2020/08/07 Python
Python爬虫开发与项目实战
2020/12/16 Python
python解决OpenCV在读取显示图片的时候闪退的问题
2021/02/23 Python
css3动画过渡实现鼠标跟随导航效果
2018/02/08 HTML / CSS
杭州信雅达系统.NET工程师面试试题
2015/02/08 面试题
阳光体育活动方案
2014/02/16 职场文书
中秋寄语大全
2014/04/11 职场文书
班级读书活动总结
2014/06/30 职场文书
绘画专业自荐信
2014/07/04 职场文书
部门2014年度工作总结
2014/11/12 职场文书
车间主任岗位职责
2015/02/03 职场文书
Django给表单添加honeypot验证增加安全性
2021/05/06 Python
nginx共享内存的机制详解
2022/03/21 Servers