一、基本介绍
1、Set-Cookie:响应首部字段
服务端可以使用Set-Cookie首部为客户端种入Cookie。
"Set-Cookie":"id=123"
"Set-Cookie":["id=123","name=zd","age=18"]
2、Cookie:请求首部字段
当客户端被中入Cookie后,每一次新的请求时客户端都会将Cookie自动带上
二、Cookie快速入门案列
1、步骤一:开启NodeJs服务端测试HTTP连接
NodeJs服务端代码如下:
const http = require("http");
const fs = require("fs");
const host = "127.0.0.1";
const port = 8080;
const server = http.createServer((requestMsg, response) => {
if (requestMsg.url === "/") {
fs.readFile("../html/cookie.html",(err,data)=>{
if(!err){
//设置响应返回html
response.writeHead(200,"OK",{
"Content-Type":"text/html"
})
response.end(data);
}else {
response.writeHead(404," NOT Find File",{
"Content-Type":"text/html"
})
response.end(`<b>404 NOT Find File</b>`);
}
})
} else {
response.end();
}
})
server.listen(port, host, () => {
console.log(`server starting at ${host}:${port}`)
})
2、步骤二:设置NodeJs服务端Cookie
修改代码:
response.writeHead(200,"OK",{
"Content-Type":"text/html"
})
为:
response.writeHead(200,"OK",{
"Content-Type":"text/html",
"Set-Cookie":[`id=123`,`name=zd`,`age=18`]
})
完整代码如下:
const http = require("http");
const fs = require("fs");
const host = "127.0.0.1";
const port = 8080;
const server = http.createServer((requestMsg, response) => {
if (requestMsg.url === "/") {
fs.readFile("../html/cookie.html",(err,data)=>{
if(!err){
//设置响应返回html
response.writeHead(200,"OK",{
"Content-Type":"text/html",
"Set-Cookie":[`id=123`,`name=zd`,`age=18`]
})
response.end(data);
}else {
response.writeHead(404," NOT Find File",{
"Content-Type":"text/html"
})
response.end(`<b>404 NOT Find File</b>`);
}
})
} else {
response.writeHead(500, "Invalid Request", {"Content-Type": "text/html; charset=utf-8"});
response.end("无效请求");
}
})
server.listen(port, host, () => {
console.log(`server starting at ${host}:${port}`)
})
3、浏览器Cookie示意图如下:
三、Cookie时效
1、基本介绍
默认Cookie是一个会话级别的Cookie
max-age
可以使用max-age来控制cookie的有效存活时间(秒)
2、代码示例:
修改代码:
//设置响应返回html
response.writeHead(200,"OK",{
"Content-Type":"text/html",
"Set-Cookie":[`id=123`,`name=zd`,`age=18`]
})
为:
//设置响应返回html
response.writeHead(200,"OK",{
"Content-Type":"text/html",
"Set-Cookie":[`id=123`,`name=zd`,"age=18;max-age=5"]
})
3、代码说明:
age字段在Cookie中只保存5秒,之后会消失。
四、Cookie作用域——HttpOnly
1、基本介绍:
HttpOnly :
为避免跨域脚本 (XSS) 攻击,通过JavaScript的 Document.cookie API无法访问带有 HttpOnly 标记的Cookie。
HttpOnly 标记的Cookie字段,客户端无法获取数据。
2、代码示例:
修改代码:
//设置响应返回html
response.writeHead(200,"OK",{
"Content-Type":"text/html",
"Set-Cookie":[`id=123`,`name=zd`,"age=18;max-age=5"]
})
为:
//设置响应返回html
response.writeHead(200,"OK",{
"Content-Type":"text/html",
"Set-Cookie":[`id=123`,`name=zd;HttpOnly`,"age=18;max-age=5"]
})
3、代码说明:
客户端获取Cookie代码:
//客户端访问cookie
console.log(document.cookie)
在浏览器log中无法获取name字段及其内容。
五、Cookie域名绑定
Cookie是绑定域名的,不同域名之间的Cookie不同
const http = require("http");
const fs = require("fs");
const host = "127.0.0.1";
const port = 8080;
// Cookie是绑定域名的,不同域名之间的Cookie不同
const server = http.createServer((requestMsg, response) => {
if (requestMsg.url === "/") {
fs.readFile("../html/cookie.html",(err,data)=>{
if(!err){
if(requestMsg.headers["host"]==="test.com:8080"){
response.writeHead(200,"ok",{
"Content-Type":"text/html",
"Set-Cookie":"test.com=123123212"
})
}
if(requestMsg.headers["host"]==="b.test.com:8080"){
//设置响应返回html
response.writeHead(200,"OK",{
"Content-Type":"text/html",
"Set-Cookie":"b.test.com=bbbbbbbbbbbbb"
})
}
if(requestMsg.headers["host"]==="a.test.com:8080"){
//设置响应返回html
response.writeHead(200,"OK",{
"Content-Type":"text/html",
"Set-Cookie":"a.test.com=aaaaaaaaaaaaaaaa"
})
}
response.end(data);
}else {
response.writeHead(404," NOT Find File",{
"Content-Type":"text/html"
})
response.end(`<b>404 NOT Find File</b>`);
}
})
} else {
response.writeHead(500, "Invalid Request", {"Content-Type": "text/html; charset=utf-8"});
response.end("无效请求");
}
})
server.listen(port, host, () => {
console.log(`server starting at ${host}:${port}`)
})
六、Cookie作用域——Domain实现跨域名Cookie
由上面可知: Cookie是绑定域名的,不同域名之间的Cookie不同。那么能否实现跨域名Cookie?
Cookie可以实现跨域名,但是只能父域名分享给子域名,也就是说通过domain设置Cookie权限,test.com域名在其本身域名和子域名都有效。
1、基本介绍
Domain
Domain 标识指定了哪些主机可以接受Cookie。如果不指定,默认为当前文档的主机(不包含子域名)。如果指定了Domain,则一般包含子域名。
2、如何更改域名?
域名文件通常在C:\Windows\System32\drivers\etc
中hosts文件中。
我们可以选择直接修改hosts文件,但通常我们会选择使用Chrome插件HostAdmin-App。
3、HostAdmin-App使用介绍
步骤一:安装HostAdmin-App,成功后界面如下:
步骤二:配置hostAdmin权限
以管理员身份运行cmd,如下命名:
cacls %windir%/system32/drivers/etc/hosts /E /G Users:W
修改域名访问权限。
步骤三:修改文件使用
4、代码示例:
const http = require("http");
const fs = require("fs");
const host = "127.0.0.1";
const port = 8080;
// Cookie是绑定域名的,不同域名之间的Cookie不同
//跨域名Cookie:只能父域名分享给子域名
const server = http.createServer((requestMsg, response) => {
if (requestMsg.url === "/") {
fs.readFile("../html/cookie.html",(err,data)=>{
if(!err){
if(requestMsg.headers["host"]==="test.com:8080"){
// domain设置Cookie权限,表示test.com域名在其本身域名和子域名都有效
response.writeHead(200,"ok",{
"Content-Type":"text/html",
"Set-Cookie":"test.com=123123212;domain=test.com"
})
}
if(requestMsg.headers["host"]==="b.test.com:8080"){
//设置响应返回html
response.writeHead(200,"OK",{
"Content-Type":"text/html",
"Set-Cookie":"b.test.com=bbbbbbbbbbbbb"
})
}
if(requestMsg.headers["host"]==="a.test.com:8080"){
//设置响应返回html
response.writeHead(200,"OK",{
"Content-Type":"text/html",
"Set-Cookie":"a.test.com=aaaaaaaaaaaaaaaa;domain=a.test.com"
})
}
response.end(data);
}else {
response.writeHead(404," NOT Find File",{
"Content-Type":"text/html"
})
response.end(`<b>404 NOT Find File</b>`);
}
})
} else {
response.writeHead(500, "Invalid Request", {"Content-Type": "text/html; charset=utf-8"});
response.end("无效请求");
}
})
server.listen(port, host, () => {
console.log(`server starting at ${host}:${port}`)
})
七、Cookie作用域——Path指定主机路径
1、基本介绍
Path
Path 标识指定了主机下的哪些路径可以接受Cookie
例如,设置 Path=/docs,则以下地址都会匹配:
/docs
/docs/Web/
/docs/Web/HTTP
2、代码示例:
const http = require("http");
const fs = require("fs");
const host = "127.0.0.1";
const port = 8080;
// Cookie是绑定域名的,不同域名之间的Cookie不同
//跨域名Cookie:只能父域名分享给子域名
const server = http.createServer((requestMsg, response) => {
if (requestMsg.url === "/") {
fs.readFile("../html/cookie.html",(err,data)=>{
if(!err){
if(requestMsg.headers["host"]==="test.com:8080"){
// domain设置Cookie权限,表示test.com域名在其本身域名和子域名都有效
//cooki未配置path时,在当前域名下/和其子目录都有效,如果配置path=/a,只有/a和/a/.../(子目录)有效
response.writeHead(200,"ok",{
"Content-Type":"text/html",
"Set-Cookie":"test.com=123123212;domain=test.com;path=/a"
})
}
if(requestMsg.headers["host"]==="b.test.com:8080"){
//设置响应返回html
response.writeHead(200,"OK",{
"Content-Type":"text/html",
"Set-Cookie":"b.test.com=bbbbbbbbbbbbb"
})
}
if(requestMsg.headers["host"]==="a.test.com:8080"){
//设置响应返回html
response.writeHead(200,"OK",{
"Content-Type":"text/html",
"Set-Cookie":"a.test.com=aaaaaaaaaaaaaaaa;domain=a.test.com"
})
}
response.end(data);
}else {
response.writeHead(404," NOT Find File",{
"Content-Type":"text/html"
})
response.end(`<b>404 NOT Find File</b>`);
}
})
} else {
response.writeHead(500, "Invalid Request", {"Content-Type": "text/html; charset=utf-8"});
response.end("无效请求");
}
})
server.listen(port, host, () => {
console.log(`server starting at ${host}:${port}`)
})