01-cookie · Nodejs

# cookie 每个 Cookie 都有一定的属性，如什么时候失效，要发送到哪个域名，哪个路径等等。这些属性是通过 Cookie 选项来设置的，Cookie 选项包括：expires(有效期)、domain、path(domain 和 path一起来限制 cookie 能被哪些 URL 访问)、secure(限制 HTTPS 传输)、HttpOnly(限制 JS 代码操作)。在设置任一个 Cookie 时都可以设置相关的这些属性，当然也可以不设置，这时会使用这些属性的默认值。在设置这些属性时，属性之间由一个**分号**和一个**空格**隔开。 ~~~ 'key=name; expires=Thu, 25 Feb 2016 04:18:00 GMT; domain=ppsc.sankuai.com; path=/; secure; HttpOnly' ~~~ ~~~ document.cookie = 'name=zs'; //设置数据 document.cookie = 'email=18@126.com'; //设置数据 document.cookie = 'name=ls'; // 修改 var date = new Date(); date.setDate(date.getDate() + 7); document.cookie = 'age=18; expires=' + date; // 设置数据并设置有效期 console.log(document.cookie) // 获取数据 ~~~ # 同源说明若两个页面的协议，端口（如果有指定）和域名都相同，则两个页面具有相同的源。下表给出了相对 [http://store.company.com/dir/page.html](http://store.company.com/dir/page.html) 同源检测的示例： * [http://store.company.com/dir2/other.html](http://store.company.com/dir2/other.html) 同源只有路径不同 * [http://store.company.com/dir/inner/another.html](http://store.company.com/dir/inner/another.html) 同源只有路径不同 * [https://store.company.com/secure.html](https://store.company.com/secure.html) 跨域不同协议 ( https 和 http ) * [http://store.company.com:81/dir/etc.html](http://store.company.com:81/dir/etc.html) 跨域不同端口 ( http:// 80 是默认的) * [http://news.company.com/dir/other.html](http://news.company.com/dir/other.html) 跨域不同域名 ( news 和 store ) Cookie 是同源共享的，不可以跨域访问的。 # Cookie 操作封装 ~~~ var Cookie = { getCookie : function(key) { // 先把字符串转换为数组 var keyValues = document.cookie.split('; '); var value; // 遍历数组 keyValues.forEach(function (ele) { var keyValue = ele.split('='); if(key == keyValue[0]){ value = keyValue[1]; return; // 找到结束循环 } }) return value; }, setCookie : function(key, value, day) { if(arguments.length == 3) { var date = new Date(); date.setDate(date.getDate() + day); document.cookie = key + '=' + value + '; expires=' + date; }else { document.cookie = key + '=' + value; } }, removeCookie : function(key) { this.setCookie(key, '', -1); }, getKeys : function () { var keyValues = document.cookie.split('; '); return keyValues.map(function(keyValue){ return keyValue.split('=')[0]; }); }, clearCookie : function() { var keys = this.getKeys(); keys.forEach(function(key){ Cookie.remove(key); }); } } ~~~ # 工作流程首先必须明确一点，存储 Cookie 是浏览器提供的功能。Cookie 其实是存储在浏览器中的纯文本，浏览器的安装目录下会专门有一个 Cookie 文件夹来存放各个域下设置的 Cookie。当网页要发 HTTP 请求时，浏览器会先检查是否有相应的 Cookie（同源），有则自动添加在请求头中的 cookie 字段中。这些是浏览器自动帮我们做的，而且每一次 HTTP 请求浏览器都会自动帮我们做。存储在 Cookie 中的数据，每次都会被浏览器自动放在 HTTP 请求中，如果这些数据并不是每个请求都需要发给服务端的数据，浏览器这设置自动处理无疑增加了网络开销；但如果这些数据是每个请求都需要发给服务端的数据（比如身份认证信息），浏览器这设置自动处理就大大免去了重复添加操作。所以对于那设置“每次请求都要携带的信息（最典型的就是身份认证信息）”就特别适合放在 Cookie中，其他类型的数据就不适合了。 ~~~ // 客户端代码 document.cookie = 'age=18; path=/'; var xhr = new XMLHttpRequest(); xhr.open('get', 'url', true); xhr.onload = function () { if(xhr.status >= 200 && xhr.status < 300 || xhr.status == 304) { console.log("成功" + xhr.responseText); } } xhr.send(); ~~~ ~~~ // 服务端代码 // 获取 Cookie 数据 const express = require('express'); const path = require('path'); let app = express(); app.use('/static', express.static(path.join(__dirname,'static'))); app.get('/a', (req, res) => { console.log(req.header('Cookie')); res.send('XX'); }) app.listen(8888, ()=> console.log('启动成功')); ~~~