在说cookie与session的概念之前,我们讨论一个问题,那就是如何保持用户的登录状态。
在之前的课程中,客户端向服务器发送的每一次请求都是独立的,但是当我们访问一些电商网站的时候,可能会发现,当我登录之后,再访问自己的购物车时,确实可以找到自己所添加的商品,也就是说网站保持了我们的登录状态。
概述
网站服务器程序可以在浏览器中写入cookie,然后浏览器再次访问这个网站时,就会带着这个cookie。
实例代码如下所示
1 router.get("/", async ctx => {
2 ctx.cookies.set("username","xiaoming");
3 ctx.body = "hello cookie";
4 })
可以在chrome调试工具中的network选项卡查看cookie内容
写入cookie之后,这个浏览器再次访问这个网站的任何一个页面,都会带着这个cookie。
通过maxAge
可以设置cookie过期的毫秒数,实例代码如下所示
1 ctx.cookies.set("username","xiaoming",{
2 maxAge:5000 //过期时间设置为五秒
3 })
可以通过下面的方法获取cookie。
1 router.get("/images", async ctx => {
2 let usr = ctx.cookies.get("username");
3 ctx.body = usr;
4 })
记录网页访问次数
利用cookie,可以记录客户端访问浏览器的次数,实例代码如下所示:
1 router.get("/count", async ctx => {
2 let count = ctx.cookies.get("count");
3 if(count > 0){
4 count = ++count;
5 ctx.cookies.set("count",count,{
6 maxAge:2000
7 });
8 }else{
9 count = 1;
10 ctx.cookies.set("count",1);
11 }
12 ctx.body = count
13 })
概述
利用cookie在客户端存储数据是完全透明的,如果存储一些用户信息,会导致很严重的安全问题,所以为了记录用户的登录状态,需要使用cookie与session结合的方式。
cnpm install --save koa-session
例如给session设置一个count属性,可以直接通过赋值的方式
ctx.session.count = 0;
获取也可以使用相同的方法
let count = ctx.session.count
记录网页访问次数
1 const session = require("koa-session");
2 //加密的密钥,服务器通过加密的cookie获取session
3 app.keys = ['secret'];
4 app.use(session({
5 maxAge:2000,
6 },app))
7
8 router.get("/session", async ctx => {
9 if(ctx.session.count>0){
10 ctx.session.count = ++ctx.session.count;
11 }else{
12 ctx.session.count = 1
13 }
14 ctx.body = ctx.session.count
15 })
1 //处理表单
2 router.post("/login", async ctx => {
3 let username = ctx.request.body.username;
4 let password = ctx.request.body.password;
5 if(username == "admin" && password == "123456"){
6 ctx.session.username = username
7 ctx.redirect("/video")
8 }else{
9 ctx.redirect("/")
10 }
11 })
12
13 //视频页
14 router.get("/video", async ctx => {
15 console.log(ctx.session.username)
16 if(ctx.session.username){
17 await ctx.render("c",{username:ctx.session.username})
18 }else{
19 ctx.redirect("/")
20 }
21 })
22 //表单页面
23 router.get("/login", async ctx => {
24 await ctx.render("index")
25 })
26 //注销
27 router.get("/logout", async ctx => {
28 ctx.session.username = ""
29 ctx.redirect("/")
30 })
在上一节的课后练习基础上,实现融职教育的登录功能,要求如下