koa2 从入门到进阶之路 （七）

以前的文章咱们介绍了一下 koa koa-static静态资源中间件，本篇文章咱们来看一下 koa 中 cookie 和 session 的使用。

cookie 是存储于访问者的计算机中的变量。可让咱们用同一个浏览器访问同一个域名的时候共享数据。

HTTP 是无状态协议。简单地说，当你浏览了一个页面，而后转到同一个网站的另外一个页 面，服务器没法认识到这是同一个浏览器在访问同一个网站。每一次的访问，都是没有任何关系的。

咱们将以前项目中的 app.js 改成以下代码：

 1 //引入 koa模块
 2 const Koa = require('koa');
 3 const Router = require('koa-router');
 4 const views = require('koa-views');
 5 const static = require('koa-static');
 6 
 7 //实例化
 8 const app = new Koa();
 9 const router = new Router();
10 
11 //配置静态资源中间件
12 app.use(static(__dirname + "/static"));
13 
14 //配置模板引擎中间件
15 app.use(views('views', {
16     extension: 'ejs'
17 }));
18 
19 router.get('/', async (ctx) => {
20     // 设置 cookie
21     ctx.cookies.set('userinfo',encodeURIComponent('张三'),{maxAge:10*1000})
22     await ctx.render('index', {});
23 });
24 
25 router.get('/news', async (ctx) => {
26     // 获取 cookie
27     console.log(decodeURIComponent(ctx.cookies.get('userinfo')));
28     await ctx.render('index', {});
29 });
30 
31 //启动路由
32 app.use(router.routes());
33 app.use(router.allowedMethods());
34 
35 app.listen(3000);

咱们在 router.get("/" ) 中经过 ctx.cookie.set() 的形式设置了一个 "userifon" 的 cookie ,而后在 router.get("/news" ) 中经过 ctx.cookie.get() 的形式来获取咱们设置的 userinfo 的 cookie 值。

当咱们运行 localhost：3000 后再运行 localhost：3000/news 时，咱们在代码编辑器控制台能够看到以下输出结果：

从上图能够看出咱们已经获取到了 userinfo = "张三" 的 cookie 值。

在 ctx.cookie.set() 中第三个参数为一个对象，里面有一些可选参数，如上面咱们设置了一个 maxAge：10 * 1000；意思是该 cookie 值存储时间为 10 * 1000 毫秒，即 10 秒钟，在 10 秒以后会消失，还有其余可选参数，以下：

在上面的程序中，咱们还用到了

encodeURIComponent 和 decodeURIComponent 

上面的两个名词分别表示对参数编码和解码，咱们在传输数据的时候若是是汉字，如 "张三"，就须要对其编码和解码，这样才能对内容作正确的传输。

 

接下来咱们再看一下 koa 中 session 的使用。

session 是另外一种记录客户状态的机制，不一样的是 Cookie 保存在客户端浏览器中，而 session 保存在服务器上。当浏览器访问服务器并发送第一次请求时，服务器端会建立一个 session 对象，生 成一个相似于 key,value 的键值对， 而后将 key(cookie)返回到浏览器(客户)端，浏览 器下次再访问时，携带 key(cookie)，找到对应的 session(value)。 客户的信息都保存 在 session 中。

 

使用 koa 中的 session，咱们须要安装 koa-session 的模块

npm install koa-session --save

咱们将上面的 app.js 改成以下：

 1 //引入 koa模块
 2 const Koa = require('koa');
 3 const Router = require('koa-router');
 4 const views = require('koa-views');
 5 const static = require('koa-static');
 6 const session = require('koa-session');
 7 
 8 //实例化
 9 const app = new Koa();
10 const router = new Router();
11 
12 //配置静态资源中间件
13 app.use(static(__dirname + "/static"));
14 
15 //配置模板引擎中间件
16 app.use(views('views', {
17     extension: 'ejs'
18 }));
19 
20 //配置session的中间件
21 app.keys = ['some secret hurr'];   /**cookie的签名 默认*/
22 const CONFIG = {
23     key: 'koa:sess', /** 默认 */
24     maxAge: 10000,  /**  cookie的过时时间 */
25     overwrite: true, /** 默认 能够重写过时时间 */
26     httpOnly: true, /**  true表示只有服务器端能够获取 cookie */
27     signed: true, /** 默认 签名 */
28     rolling: true, /** 在每次请求时强行设置 cookie，这将重置 cookie 过时时间（默认：false） */
29     renew: false, /** 当用户进行浏览器操做时刷新 cookie 过时时间 */
30 };
31 app.use(session(CONFIG, app));
32 
33 router.get('/', async (ctx) => {
34     // 设置 cookie
35     ctx.session.userinfo='张三';
36     await ctx.render('index', {});
37 });
38 
39 router.get('/news', async (ctx) => {
40     // 获取 cookie
41     console.log(ctx.session.userinfo);
42     await ctx.render('index', {});
43 });
44 
45 //启动路由
46 app.use(router.routes());
47 app.use(router.allowedMethods());
48 
49 app.listen(3000);

如上，咱们须要在最开头引入咱们的 koa-session 模块，而后设置 session 中间件。session 中也有相似于 cookie 的可选值，其中咱们只须要修改 maxAge，rolling 和 renew 三个值便可。

　　maxAge：过时时间，以毫秒为单位。

　　rolling：当咱们每次有浏览器请求时会从新刷新咱们的 session 过时时间，是一个具体的时间值，如 12:00:00。

　　renew：当咱们每次有浏览器请求时会从新刷新咱们的 session 过时时间，是一个时间范围，如 5000 毫秒。

接下来咱们就能够在咱们的浏览器中使用 session 了，咱们在进入 localhost:3000 时设置一个 userinfo="张三"，当进入 localhost:3000/news 时在代码编辑器后台打印输出这个 userinfo，以下：

咱们拿到了 userinfo："张三" 的值。

 

如今咱们来看一下 cookie 和 session 的区别：

　　一、cookie 数据存放在客户的浏览器上，session 数据放在服务器上。 

　　二、cookie 不是很安全，别人能够分析存放在本地的 cookie 并进行 cookie 欺骗，考虑到安全应当使用 session。 

　　三、session 会在必定时间内保存在服务器上。当访问增多，会比较占用你服务器的性能 考虑到减轻服务器性能方面，应当使用 cookie。 

　　四、单个 cookie 保存的数据不能超过 4K，不少浏览器都限制一个站点最多保存 20 个 cookie。