Koa Cookie 的使用

Cookie 简介

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

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

Cookie的使用场景有很多比如:保存用户信息,浏览器历史记录,猜你喜欢的功能,10天免登陆,多个页面之间的数据传递,cookie实现购物车功能

Koa Cookie 的使用

不需要安装第三方模块,可以直接在Koa 中设置 Cookie 的值

ctx.cookies.set(name,value,[options])

通过options 设置 cookie name 的value

maxAge:一个数字表示从 Date.now() 得到的毫秒(就是说cookie的有效时长)

expires: cookie 过期的Date(就是说这个cookie到某个日期时间就到期)

path:cookie 路径, 默认是'/' ,如果设置了其它,比如/news表示当访问/news的时候才设置这个cookies

domain:cookie 域名,正常情况下不要设置,当有很多个子域名的时候可以这样设置.baidu.com(这样表示baidu.com下的子域名,比如a.baidu.com或者b.baidu.com都可以)

secure:安全 cookies 默认 false,设置成 true 表示 只有 https 可以访问 

httpOnly:是否只是服务器可访问 cookies, 默认是true

overwrite :一个布尔值,表示是否覆盖以前设置的同名 的 cookies(默认是 false). 如果是 true, 在同 一个请求中设置相同名称的所有 Cookies(不 管路径或域)是否在设置此 Cookies 时从 Set-Cookie 标头中过滤掉。 

设置cookies和获取cookies

创建node应用app.js和index.html和news.html模板

1let Koa = require('koa') 2let router = require('koa-router')() 3const render = require('koa-art-template'); 4const path = require('path'); 5 6var app = new Koa() 7 8//配置 koa-art-template模板引擎 9render(app, { 10 root: path.join(__dirname, 'views'), // 视图的位置 11 extname: '.html', // 后缀名 12 debug: process.env.NODE_ENV !== 'production' //是否开启调试模式 13}); 14 15 16router.get('/',async (ctx)=>{ 17 ctx.cookies.set('userinfo', 'zhangsan', { 18 maxAge:60*1000*60 19 }); 20 let list = { 21 name: '张三' 22 } 23 await ctx.render('index',{ 24 list:list 25 }); 26}) 27 28router.get('/news',async (ctx)=>{ 29 var userinfo = ctx.cookies.get('userinfo'); 30 console.log(userinfo); 31 let app = { 32 name: '张三11', 33 userinfo: userinfo 34 }; 35 await ctx.render('news',{ 36 list: app 37 }); 38}) 39 40app.use(router.routes()); /*启动路由*/ 41app.use(router.allowedMethods()); 42app.listen(3000); 43 44<!DOCTYPE html> 45<html lang="en"> 46<head> 47 <meta charset="UTF-8"> 48 <title>Title</title> 49</head> 50<body> 51 <h2 class="title">这是一个index页面</h2> 52 <br/> 53 <h2>绑定数据</h2> 54 {{list.name}} 55</body> 56</html> 57 58<!DOCTYPE html> 59<html lang="en"> 60<head> 61 <meta charset="UTF-8"> 62 <title>Title</title> 63</head> 64<body> 65 <h2 class="title">这是一个news页面</h2> 66 <br/> 67 <h2>绑定数据</h2> 68 {{list.name}} 69 <h2>Cookies</h2> 70 {{list.userinfo}} 71</body> 72</html>

启动服务后,浏览器访问/根路由可以看到设置cookies成功

访问/news路由,获取cookies

其它options 设置

1let Koa = require('koa') 2let router = require('koa-router')() 3const render = require('koa-art-template'); 4const path = require('path'); 5 6var app = new Koa() 7 8//配置 koa-art-template模板引擎 9render(app, { 10 root: path.join(__dirname, 'views'), // 视图的位置 11 extname: '.html', // 后缀名 12 debug: process.env.NODE_ENV !== 'production' //是否开启调试模式 13}); 14 15 16router.get('/',async (ctx)=>{ 17 ctx.cookies.set('userinfo', 'zhangsan', { 18 maxAge:60*1000*60, 19 path: '/news', //这里表示当我访问/news这个路由(页面)的时候才设置这个cookies 20 httpOnly: false 21 }); 22 let list = { 23 name: '张三' 24 } 25 await ctx.render('index',{ 26 list:list 27 }); 28}) 29 30router.get('/news',async (ctx)=>{ 31 var userinfo = ctx.cookies.get('userinfo'); 32 console.log(userinfo); 33 let app = { 34 name: '张三11', 35 userinfo: userinfo 36 }; 37 await ctx.render('news',{ 38 list: app 39 }); 40}) 41 42app.use(router.routes()); /*启动路由*/ 43app.use(router.allowedMethods()); 44app.listen(3000);

重启服务后,运行,当访问到/页面的时候,没有设置cookies了,获取cookies也是为空的,访问/news的时候才设置cookies,设置了httpOnly的值为false,那么前端也可以获取到cookies

可以看到当访问/news路由(页面)时,前端可以使用document.cookie获取到cookies

Koa 中设置中文 Cookie

当设置Cookie的时候,如果有中文,运行匹配到路由后后台程序就报错了:argument value is invalid

在koa中没有直接设置中文的 ,需要自己在设置cookies(转换成base64字符 串)和获取cookies(还原base 64字符串)

1let Koa = require('koa') 2let router = require('koa-router')() 3const render = require('koa-art-template'); 4const path = require('path'); 5 6var app = new Koa() 7 8//配置 koa-art-template模板引擎 9render(app, { 10 root: path.join(__dirname, 'views'), // 视图的位置 11 extname: '.html', // 后缀名 12 debug: process.env.NODE_ENV !== 'production' //是否开启调试模式 13}); 14 15 16router.get('/',async (ctx)=>{ 17 //koa中没法直接设置中文的cookie,需要进行 18 var userinfo = new Buffer('胡椒粉').toString('base64'); // 转换成base64字符串,类似:aGVsbG8sIHdvcmxkIQ== 19 ctx.cookies.set('userinfo', userinfo, { 20 maxAge:60*1000*60 21 }); 22 let list = { 23 name: '张三', 24 } 25 await ctx.render('index',{ 26 list:list 27 }); 28}) 29 30router.get('/news',async (ctx)=>{ 31 var data = ctx.cookies.get('userinfo'); 32 var userinfo= new Buffer(data, 'base64').toString()// 还原base 64字符串 33 console.log(userinfo); 34 let app = { 35 name: '张三11', 36 userinfo: userinfo 37 }; 38 await ctx.render('news',{ 39 list: app 40 }); 41}) 42 43app.use(router.routes()); /*启动路由*/ 44app.use(router.allowedMethods()); 45app.listen(3000);

运行后可以看到浏览器端存储的cookies userinfo的值是一串看不懂的字符串,在访问/news页面获取cookies   还原base 64字符串

点赞
收藏

评论区

加载中...

相关推荐

MySQL:[Err] 1292 - Incorrect datetime value: ‘0000-00-00 00:00:00‘ for column ‘CREATE_TIME‘ at row 1

文章目录问题用navicat导入数据时,报错:原因这是因为当前的MySQL不支持datetime为0的情况。解决修改sql\mode:sql\mode:SQLMode定义了MySQL应支持的SQL语法、数据校验等,这样可以更容易地在不同的环境中使用MySQL。全局s

Oracle 分组与拼接字符串同时使用

SELECTT.,ROWNUMIDFROM(SELECTT.EMPLID,T.NAME,T.BU,T.REALDEPART,T.FORMATDATE,SUM(T.S0)S0,MAX(UPDATETIME)CREATETIME,LISTAGG(TOCHAR(

MySQL部分从库上面因为大量的临时表tmp_table造成慢查询

背景描述Time:20190124T00:08:14.70572408:00User@Host:@Id:Schema:sentrymetaLast_errno:0Killed:0Query_time:0.315758Lock_

皕杰报表之UUID

​在我们用皕杰报表工具设计填报报表时,如何在新增行里自动增加id呢?能新增整数排序id吗?目前可以在新增行里自动增加id,但只能用uuid函数增加UUID编码,不能新增整数排序id。uuid函数说明:获取一个UUID,可以在填报表中用来创建数据ID语法:uuid()或uuid(sep)参数说明:sep布尔值,生成的uuid中是否包含分隔符'',缺省为

手写Java HashMap源码

HashMap的使用教程HashMap的使用教程HashMap的使用教程HashMap的使用教程HashMap的使用教程22

2020年前端实用代码段,为你的工作保驾护航

有空的时候,自己总结了几个代码段,在开发中也经常使用,谢谢。1、使用解构获取json数据let jsonData  id: 1,status: "OK",data: 'a', 'b';let  id, status, data: number   jsonData;console.log(id, status, number )

Koa Cookie 的使用 - HelloWorld