摘要:概念是服务器发送到用户浏览器并保存在浏览器上的一块数据,它会在浏览器下一次发起请求时被携带并发送到服务器上。例如,如果设置了,则浏览器访问其子域名如也会发送。的值可以被修改,,再次刷新页面,重新发送请求,服务端控制台就会打印。
概念
Cookie是服务器发送到用户浏览器并保存在浏览器上的一块数据,它会在浏览器下一次发起请求时被携带并发送到服务器上。——MDN来做个实验
服务端代码
const http = require("http") const path = require("path") const url = require("url") const fs = require("fs") http.createServer((req, res) => { let { pathname, search } = url.parse(req.url) let cookie = req.headers.cookie console.log(JSON.stringify(cookie)) if (pathname === "/") { const file = path.resolve(__dirname, "./static/index.html") fs.readFile(file, (err, data) => { res.writeHead(200, { "Content-Type": "text/html", "Set-Cookie": ["author=nbb3210", "description=genius"] }) res.write(data.toString()) res.end() }) } else { res.end(pathname) } }).listen(3210)
./static/index.html内容如下
Cookie Cookie
这里推荐一款chrome插件,EditThisCookie,方便进行cookie的管理
启动服务端,当我们第一次访问http://localhost:3210/时,服务端控制它打印出undefined;当我们刷新页面,再次访问http://localhost:3210/时,控制台打印出"author=nbb3210; description=genius"。
"author=nbb3210; description=genius"是由服务器通过设置响应头
res.writeHead(200, { "Set-Cookie": ["author=nbb3210", "description=genius"] }) // 响应头 HTTP/1.1 200 OK Content-Type: text/html Set-Cookie: author=nbb3210 Set-Cookie: description=genius Date: Wed, 13 Dec 2017 12:35:39 GMT Connection: keep-alive Transfer-Encoding: chunked
发送给浏览器,下次发送请求时,浏览器便会在请求头上带上这段信息。
// 浏览器第一次访问服务端时发送的请求头 GET / HTTP/1.1 Host: localhost:3210 Connection: keep-alive Cache-Control: max-age=0 User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/62.0.3202.94 Safari/537.36 Upgrade-Insecure-Requests: 1 Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8 Accept-Encoding: gzip, deflate, br Accept-Language: zh-CN,zh;q=0.9,en;q=0.8
// 浏览器第二次访问服务端时发送的请求头,包含有了cookie信息 GET / HTTP/1.1 Host: localhost:3210 Connection: keep-alive Cache-Control: max-age=0 User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/62.0.3202.94 Safari/537.36 Upgrade-Insecure-Requests: 1 Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8 Accept-Encoding: gzip, deflate, br Accept-Language: zh-CN,zh;q=0.9,en;q=0.8 Cookie: author=nbb3210; description=genius
这样,服务端就可以分辨出不同浏览器端发来的请求,记录用户的状态,同样的请求,因为cookie的不同会有不同的响应。总而言之,借助cookie,服务端能区分出“你是谁?”,从而记起“你之前干了啥”
cookie的属性 Domain, Path服务端设置cookie时,可以设置domain,path,从而确定该cookie的作用域。
例如,如果设置了Domain=mozilla.org,则浏览器访问其子域名(如developer.mozilla.org)也会发送cookie。如果不设置domain,默认为域名A(网站A)向浏览器发送的cookie,只有在浏览器再次向域名A(网站A)发送请求时才会被带上。
这里的path匹配scheme:[//[user[:password]@]host[:port]][/path][?query][#fragment]中的path。例如,在上面的实验中,修改代码
"Set-Cookie": ["author=nbb3210; Path=/abc", "description=genius"]
用插件清除cookie,分别访问http://localhost:3210/,http://localhost:3210/abd,http://localhost:3210/abc,http://localhost:3210/,服务端控制台分别打印出undefined,"description=genius","author=nbb3210; description=genius","description=genius",因为只有第三次的url与cookie的path设置匹配。
HttpOnlycookie的值可以被修改,document.cookie="author=ahhh",再次刷新页面,重新发送请求,服务端控制台就会打印"description=genius; author=ahhh"。
如果把自己的cookie修改成别人的cookie,那么就可以伪装成别人,向服务端发送请求,这里的话。。。
如果cookie被设置了HttpOnly,那么再发送请求时,cookie会被带上,而浏览器端JavaScript无法修改该cookie。
例如,在上面的实验中,修改代码
"Set-Cookie": ["author=nbb3210; HttpOnly", "description=genius"]
用插件清除cookie,两次访问http://localhost:3210/,服务端控制台分别打印出undefined,"author=nbb3210; description=genius",其后,打开浏览器控制台,
> document.cookie < "description=genius" // 而 author=nbb3210 对于JavaScript来说是不可见的了
再次设置cookie
> document.cookie = "author=ahhh" < 控制台打印 "author=ahhh"
并刷新页面,重新访问http://localhost:3210/,服务端控制台仍打印"author=nbb3210; description=genius"
Secure只有在安全连接的https时,cookie才会被发送
Expires, Max-Age前面的属性确认了cookie在什么时候会被发送,Expires,Max-Age确定了cookie在什么时间范围内有效。如果不设置这两个属性,cookie在浏览器关闭时就会被删除,所以在关闭浏览器后,再次访问http://localhost:3210/,服务端控制台会打印undefined
Max-Age设置了cookie从被创建到消失持续的时间(s),如修改代码
"Set-Cookie": ["author=nbb3210; Max-Age=30", "description=genius"]
用插件清除cookie,两次访问http://localhost:3210/,服务端控制台分别打印出undefined,"author=nbb3210; description=genius",超过30s后再次访问http://localhost:3210/,服务端控制台打印出"description=genius",超过30s后,author=nbb3210失效了。
Expires指定了过期时间GMT,如果修改代码
let date = new Date() date.setTime(date.getTime() + 30 * 1000) ... "Set-Cookie": [`author=nbb3210; Expires=${date.toUTCString()}`, "description=genius"]
其作用与设置Max-Age为30s的效果一样
文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。
转载请注明本文地址:https://www.ucloud.cn/yun/92114.html
摘要:浏览器对这种行为进行了限制。大多数情况下,该请求会失败,因为他要求的认证信息。在请求头中添加自定义例如在知乎中给文章点赞结合中对的的介绍,知乎的这种方式被称为。 概念 CSRF,Cross Site Request Forgery,跨站请求伪造。 为什么跨站的请求需要伪造? 因为浏览器实现了同源策略,这里可以将站和源视为同一个概念。 同源策略 The same-origin polic...
摘要:上一篇文章简单介绍了在本地开发环境中搭建服务端和客户端,对单点登录过程有了一个直观的认识之后,本篇将探讨单点登录的实现原理。因此引入服务端作为用户信息鉴别和传递中介,达到单点登录的效果。为该流程的实现类。表示对返回结果的处理。 上一篇文章简单介绍了 CAS 5.2.2 在本地开发环境中搭建服务端和客户端,对单点登录过程有了一个直观的认识之后,本篇将探讨 CAS 单点登录的实现原理。 一...
阅读 520·2021-10-08 10:20
阅读 1460·2021-09-23 11:22
阅读 3194·2019-08-30 15:55
阅读 1389·2019-08-28 18:25
阅读 1818·2019-08-28 18:14
阅读 1185·2019-08-26 11:37
阅读 2869·2019-08-26 10:18
阅读 2396·2019-08-23 18:39