Cookie和Session-逐码极客

由于HTTP是一种无状态的协议，服务器单从网络连接上无法知道访客身份。这时服务器给客户端一个通行证，所有的访问都必须携带。这样服务器就能从通行证上确认客户身份了。

Cookie的处理：

服务端向客户端发送Cookie 客户端的浏览器把Cookie保存然后在每次请求浏览器都会将Cookie发送到服务端在HTML文档被发送之前，Web服务器通过传送HTTP 包头中的Set-Cookie 消息把一个cookie 发送到用户的浏览器中，如下示例：

Set-Cookie: name=value; Path=/; expires=Wednesday, 09-Nov-99 23:12:40 GMT; 属性：

name=value：
- name，Cookie名，一旦创建不可更改
- value，Cookie值。如果为 Unicode 字符，需为 字符编码 ，如果为 二进制数据，则需使用 BASE64编码
Expires：过期时间（秒）。在该时间点后 Cookie 失效，如 expires=Wednesday, 09-Nov-99 23:12:40 GMT
maxAge：失效时间（毫秒）
- 正数，Cookie在 maxAge 后失效
- 负数，临时Cookie，关闭浏览器即失效，浏览器不会以任何形式保存该Cookie
- 0，表示删除该Cookie。默认为 –1
secure：是否使用安全协议传输。安全协议有 HTTPS，SSL等，在传输数据之前先加密数据。默认 false
Path： Cookie的使用路径
- 若值为 /a/，则只有 /a 的页面可以访问该Cookie
- 若值为 /，则本域名下所有页面都可以访问该Cookie。注意最后一个字符必须为 /
domain：可以访问该Cookie的域名。如果设置为 .xulizhong.top，则所有以 xulizhong.top 结尾的域名都可以访问该Cookie。注意第一个字符必须为 .
httpOnly：微软对Cookie的扩展。值为 true，则通过程序（JS脚本、applet等）将无法读取到Cookie信息，防止XSS攻击。默认 false

Session

客户端访问服务器的时，服务器将客户端信息以某种形式记录在服务器上，然后把 session_id 以 cookie 的形式传递给客户端。当客户端再次访问时都会在 header 中带有 cookie 信息，服务器就可以通过 cookie 查询到 session，然后为之服务。

属性：

name：设置 cookie 中，保存 session 的字段名称，默认为 connect.sid
store：存储方式，默认存放在内存中，也可以使用 redis， mongodb 等
secret：cookie签名。通过改值计算 hash 并放在 Cookie 中，使产生的 signedCookie 防篡改
cookie：Cookie 的相关配置，默认为 default: { path: '/’, httpOnly: true, secure: false, maxAge: null }
genid：产生一个新的 session_id 时使用的函数。默认使用 uid2 中间件
rolling：每个请求都重新设置一个 cookie。默认为 false
resave：即使 session 没有被修改，也保存 session 值。默认为 true

前后端跨域如何传递Cookie

第一种解决方法

服务器端

配置CORS即可

var cors = require('cors');
app.use(cors({credentials: true, origin: 'http://localhost'}));

客户端

配置 Axios.defaults.withCredentials = true，解决大部分浏览器跨域传递Cookie。

但IE11（默认设置）下依然无法获取Cookie，服务端Nginx需要做如下配置

location / {
    root   /data/nginx/html;
    index  index.html index.htm;

    proxy_pass http://192.168.10.60:811/xx-erp/;
    proxy_set_header Host $host;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    add_header P3P "CP=CAO PSA OUR";
}

第二种解决方法

另外，还有一种方式，在开发阶段，用vue中间件proxyTable，把后端接口，代理为与前端执行时的域一致

第三种解决方法

服务器端

响应头设置 Access-Control-Allow-Credentials: true 表示跨域时，允许cookie添加到请求中。另外要将 Access-Control-Allow-Origin指定到具体的域，否则cookie不会带到客户端

客户端

配置 Axios.defaults.withCredentials = true