Cookie 技术产生源于 HTTP 协议在互联网上的急速发展。随着互联网的快速发展,人们需要更复杂的互联网交互活动,就必须同服务器保持活动状态。为了适应用户的需求,技术上推出了各种保持Web浏览状态的手段,其中就包括了Cookie技术。
网站常常需要记录访问者的一些一些基本信息,例如如身份识别号码、密码、用户在 Web 站点购物的方式或用户访问该站点的次数。 网站为了辨别用户身份、进行 session 跟踪需要把数据储存在用户本地终端上,这些数据被称为 cookie。
通过设置 HTTP 的 Set-Cookie 消息头,Web 服务器可以指定存储一个 cookie。Set-Cookie 消息的格式如下面所示,括号中的部分都是可选的:
Set-Cookie:value [ ;expires=date][ ;domain=domain][ ;path=path][ ;secure]
消息头的第一部分,value 部分,通常是一个 name=value 格式的字符串。服务端向客户端发送的 HTTP 响应中设置 HTTP 的 Set-Cookie 消息头,一个具体的例子如下:
Connection:keep-aliveContent-Type:text/plainDate:Fri, 14 Jul 2017 10:49:23 GMTSet-Cookie:user=ZhangSanTransfer-Encoding:chunked
在这个例子中,服务端向客户端发送的 Http 消息头中,设置了 'Set-Cookie:user=ZhangSan',客户端浏览器将接受到字符串 'user=ZhangSan' 作为 cookie。
当一个 cookie 存在,并且条件允许的话,该 cookie 会在接下来的每个请求中被发送至服务器。cookie 的值被存储在名为 Cookie 的 HTTP 消息头中,并且只包含了 cookie 的值,其它的选项全部被去除。
客户端向服务端发送的 HTTP 请求中设置 Cookie 消息头,一个具体的例子如下:
Connection:keep-alive
Cookie:user=ZhangSan
Host:localhost:8080
User-Agent:Mozilla/5.0 AppleWebKit/537.36 Chrome Safari
在这个例子中,客户端向服务端发送的 Http 消息头中,设置了 'Cookie:user=ZhangSan',服务端接受到字符串 'user=ZhangSan' 作为 cookie,从而确认此次请求对应的用户。
localhost:8080/set:设置 Set-Cookie 消息,在客户端中创建和保存 cookie
localhost:8080/show:将客户端发送的 cookie 输出打印
localhost:8080/del:设置 Set-Cookie 消息,将 cookie 从客户端中删除 为了演示最底层是如何访问 cookie,这个服务程序仅仅使用 node.js 的原生接口去访问 cookie 。
var http = require('http');
http.createServer(function(req,res){
var url = req.url;
if(url.startsWith('/set')){
res.writeHead(200,{
'Content-Type':'text/plain',
'Set-Cookie':'user=ZhangSan'
});
res.write('Set-Cookie');
res.end();
}
if(url.startsWith('/show')){
var cookie = req.headers.cookie;
res.writeHead(200,{
'Content-Type':'text/plain'
});
res.write('Show-Cookie: '+cookie);
res.end();
}
if(url.startsWith('/del')){
res.writeHead(200,{
'Content-Type':'text/plain',
'Set-Cookie':'user=;expires=Thu, 01 Jan 1970 00:00:00 GMT'
});
res.write('Del-Cookie');
res.end();
}
}).listen(8080);
启动程序 node main.js
在浏览器中第一次输入http://localhost:8080/show
浏览器中显示结果为 Show-Cookie: undefined
初始时刻,浏览器没有保存对应 localhost 的 cookie,所以结果为 undefined
在浏览器中输入http://localhost:8080/set
浏览器中显示结果为 Set-Cookie
服务器已经设置 Http 的 Set-Cookie 消息头,设置 cookie 为 'user=ZhangSan'
客户端收到 cookie 后,会将该 cookie 保存到本地
在浏览器中第二次输入http://localhost:8080/show
浏览器中显示结果为 Show-Cookie: user=ZhangSan
客户端将已经保存在本地的 cookie('user=ZhangSan') 发送给服务端
服务端将收到的 cookie 回显给客户端
在浏览器中输入http://localhost:8080/del
浏览器中显示结果为 Del-Cookie
服务器已经设置 Http 的 Set-Cookie 消息头,设置 cookie 为超时
客户端收到 Http 响应后,会将超时的 cookie 删除
在浏览器中第三次输入http://localhost:8080/show
浏览器中显示结果为 Show-Cookie: undefined
浏览器已经删除存对应 localhost 的 cookie,所以结果为 undefined
换成Express框架:
var express = require('express');
var cookieParser = require('cookie-parser');
var app = express();
app.use(cookieParser());
app.get('/set',function(req,res){
res.cookie('user','ZhangSan');
res.send('
Set-Cookie
');
});
app.get('/show',function(req,res){
var cookies = req.cookies;
var text = JSON.stringify(cookies);
res.send('
Show-Cookie: ' + text + '
');});
app.get('/del',function(req,res){
res.clearCookie('user');
res.send('
Del-Cookie
');});
app.listen(8080);