Cookies

问题?

• 有一些网站，一旦登录，后续再访问该网站，都保持着登录状态。 然而，当你关闭重启浏览器后（或者过一段较长的时间后），就需要你重新登录
• 有一些网站的登录页面，会有一个复选框：记住我一天、一月、一年。当你选中后，即使你关闭浏览器，也不需要重新登录
  • 但银行、支付宝比较安全的网站，通常提示：公共场合不要复选它
  • 但是，当你换一台机器后，你又需要重新登录

猜想

• 网页一定是在我的电脑里留下什么标记？这些标记并且会定时被清除
• 但是：在浏览器中运行的网页能够向我的硬盘里写入数据吗？
  • WEB应用为何优于桌面软件，就是因为：安全、安全、安全

什么是 cookies

• 允许浏览器可以读写本地硬盘中一个特殊目录下的特殊文件，即 cookies 文件
• 浏览器默认为每一个域名生成一个cookies文件，并且保证该文件只能被同一域名的页面所读取
• 浏览器每次发起请求时，会将本域名对应的cookies文件的内容，附加在http request header中的cookies字段，发送给 WEB 服务器
• WEB服务器可通过设置 http response header中的set cookies字段通知浏览器端更新cookies，浏览器收到该响应后将cookies字段存储到本地cookies文件中

使用浏览器的开发者工具中的network面大舞台，查看 http 请求的 request和response头信息，可查看 cookies 的传输

cookies的存储位置:现代浏览器

采用文件型数据库，如sqlite，易于管理(chrome://settings/siteData )，但不易查看

• chrome
  • C:\Users[username]\AppData\Local\Google\Chrome\User Data\Default\Network
• edge for win10/11
  • %LOCALAPPDATA%\Microsoft\Edge\User Data\Default\Network
• firefox
  • %APPDATA%\Mozilla\Firefox\Profiles

https://www.thewindowsclub.com/cookies-folder-location-windows

cookies的存储位置:IE浏览器

采用文本文件方式存储，易于观察，但不易于管理

• win10: 浏览器->设置->浏览历史记录->设置->查看文件
  • https://answers.microsoft.com/en-us/ie/forum/all/ie11-normal-cookies-are-gone-since-creators-fall/7f2b38a0-aeaf-4c4b-a53f-dd438fdc20cd
• win8: C:\Users\[账户名]\AppData\Local\Microsoft\Windows\INetCookies
• win7
  • C:\Users\[账户名]\AppData\Roaming\Microsoft\Windows\Cookies
  • C:\Users\[账户名]\AppData\Roaming\Microsoft\Windows\Cookies\Low
• xp C:\Documents and Settings\[账户名]\Local Settings\cookies\

注意：需要设置显示已隐藏的文件夹 https://www.cnblogs.com/gdyblog/p/5874362.html

参考 https://www.thewindowsclub.com/cookies-folder-location-windows

cookies的结构

• Name: Cookie名称,必须使用只能用在URL中的字符，一般用字母及数字
• Value: Cookie值, 同样也只能使用可以用在URL中的字符，一般需要对其使用encodeURI方法进行转义
• Expires: 过期时间，一个GMT格式的时间
• Path： 路径，在这个路径下面的页面才可以访问该Cookie，一般设为“/”，以表示同一个站点的所有页面都可以访问这个Cookie
• Domain： 子域，指定在该子域下才可以访问Cookie，例如要允许Cookie在 bbs.x.com 下可以访问，但在 www.x.com 下不能访问，则需要将domain设置成bbs.x.com
• Secure： 安全性，指定Cookie是否只能通过https协议访问，一般的Cookie使用HTTP协议既可访问，如果设置了Secure（空值即可），则只有当使用https协议连接时cookie才可以被页面访问

cookies 的读与写

document.cookie = "userName=" + encodeURI("tom") + 
     "; expires=" + (new Date("2022-01-01")).toUTCString() + 
     "; path=/; domain=x.com; secure";

console.log(document.cookie);

什么是登录和登出？

• 当用户通过浏览器访问网页时，浏览器将登录信息记录在cookies，并持续发送给服务端脚本
• 当用户不希望浏览器记录自己的访问身份信息时，可禁止浏览器记录(浏览器设置：禁用cookies)或删除掉已存有登录信息的cookies

浏览器会话： cookies的默认失效机制

• 关闭当前登录的浏览器标签窗口，再打开另一个，是否需要重新登录？
• 关闭浏览器的所有窗口标签时，重新打开浏览器，是否需要重新登录？
• cookies的默认设置：如果未对cookies设置失效时间，则在浏览器会话关闭后，浏览器自动删除该cookies

浏览器会话： 浏览器窗口进程的一个生命周期

自定义会话：显示设置失效时间

• 定时登出：登录脚本设置一个有限的未来时间，当时间到达，浏览器将自动删除cookies
• 用户登出： 登录脚本设置一个无限大的未来时间，只有当用户点击登出即执行登出脚本时，登出脚本将设置一个负失效时间(比当前系统时间更早的时间值)，浏览器执行脚本时将立即删除该cookies
  • 或者浏览器端的cookies被清除(如浏览器重装、系统重装等)

同源： cookies的安全机制

• 在http://www.a.com登录，用户信息被该站页面的脚本写入cookies。随后，用户又访问了http://www.b.com，请b.com的网页中的脚本是否能读取到含有a.com用户的登录信息？
• 如果用户随后访问的是http://bbs.a.com,请问能否读取到？
• 如果用户随后访问的是https://www.a.com,请问能否读取到？

同源策略： 浏览器的一种安全机制，客户端脚本在没有明确授权的情况下，只能读写与自身同一来源的资源，如cookies等

教程

http://www.runoob.com/js/js-cookies.html

工具

• cookies api 库，简化和统一cookie的读写 https://github.com/js-cookie/js-cookie