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 相关文章推荐
自适应高度框架 ----属个人收藏内容
Jan 22 Javascript
使用新的消息弹出框blackbirdjs
Oct 16 Javascript
基于jquery库的tab新形式使用
Nov 16 Javascript
JS辨别访问浏览器判断是android还是ios系统
Aug 19 Javascript
jQuery插件Slider Revolution实现响应动画滑动图片切换效果
Jun 05 Javascript
浅谈JavaScript for循环 闭包
Jun 22 Javascript
vue.js父组件使用外部对象的方法示例
Apr 25 Javascript
移动端手指放大缩小插件与js源码
May 22 Javascript
Angular 利用路由跳转到指定页面的指定位置方法
Aug 31 Javascript
详解jQuery中的getAll()和cleanData()
Apr 15 jQuery
highcharts.js数据绑定方式代码实例
Nov 13 Javascript
vue2.* element tabs tab-pane 动态加载组件操作
Jul 19 Javascript
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文件上传(实例)
2013/10/27 PHP
配置php.ini实现PHP文件上传功能
2014/11/27 PHP
php 自定义函数实现将数据 以excel 表格形式导出示例
2019/11/13 PHP
jQuery 注意事项 与原因分析
2009/04/24 Javascript
javascript getElementsByClassName实现代码
2010/10/11 Javascript
JSDoc 介绍使用规范JsDoc的使用介绍
2011/02/12 Javascript
javascript动态的改变IFrame的高度实现自动伸展
2013/10/12 Javascript
在JavaScript中使用对数Math.log()方法的教程
2015/06/15 Javascript
解析如何利用iframe标签以及js制作时钟
2016/12/08 Javascript
jquery实现手机端单店铺购物车结算删除功能
2017/02/22 Javascript
JavaScript中递归实现的方法及其区别
2017/09/12 Javascript
vue的一个分页组件的示例代码
2017/12/25 Javascript
jQuery动态添加li标签并添加属性和绑定事件方法
2018/02/24 jQuery
vue实现搜索功能
2019/05/28 Javascript
小程序自动化测试的示例代码
2020/08/11 Javascript
python2.7删除文件夹和删除文件代码实例
2013/12/18 Python
Python实现二叉堆
2016/02/03 Python
玩转python爬虫之爬取糗事百科段子
2016/02/17 Python
详解python并发获取snmp信息及性能测试
2017/03/27 Python
理解python中生成器用法
2017/12/20 Python
python单例模式获取IP代理的方法详解
2018/09/13 Python
使用Python 统计高频字数的方法
2019/01/31 Python
基于Python实现扑克牌面试题
2019/12/11 Python
pytorch实现focal loss的两种方式小结
2020/01/02 Python
python代码实现图书管理系统
2020/11/30 Python
深入探究HTML5的History API
2015/07/09 HTML / CSS
eBay法国购物网站:eBay.fr
2017/10/21 全球购物
日本最大级玩偶手办购物:あみあみ Amiami
2018/04/23 全球购物
会计实习生工作总结的自我评价
2013/10/07 职场文书
应届生如何写自荐信
2014/01/05 职场文书
整改报告怎么写
2014/11/06 职场文书
学生考试舞弊检讨书
2015/01/01 职场文书
酒店总经理岗位职责
2015/04/01 职场文书
经营目标责任书
2015/05/08 职场文书
黄埔军校观后感
2015/06/10 职场文书
决心书格式范文
2015/09/23 职场文书