HostOnly Cookie

大部分场景下，浏览器中都不会存在两个同名的 cookie。但是按照以下代码对 cookie 进行赋值，就会发现在 chrome 当中，出现了两个同名的 cookie。

function setCookie(name,value,extra) {
  document.cookie = `${name}=${value || ""}; path=/; ${extra || ""}`
}

setCookie("a","a1")
setCookie("a","a2", "domain=www.baidu.com")
setCookie("a","a3", "domain=.www.baidu.com")

这种 cookie 也即 HostOnly Cookie，相关内容笔者均从你所不知道的 HostOnly Cookie了解，并在 chrome 97 进行了实践。

在 cookie 中不包含 domain 属性，或者 domain 属性为空 / domain 属性不合法（不等于页面 url 中的 domain 部分、也不是页面 domain 的大域）时，host-only-flag 为 true。此时，我们把这个 cookie 称之为 HostOnly Cookie。

浏览器在获取 cookie 时，首先要检查 domain 匹配性，其次才检查 path、secure、httponly 等属性的匹配性。如果 host-only-flag 为 true 时，只有当前域名与该 cookie 的 domain 属性完全相等才可以进入后续流程；host-only-flag 为 false 时，符合域规则（domain-matches）的域名都可以进入后续流程。

以 baidu.com 为例，在这个站点设置 HostOnly Cookie，即前文的 setCookie("a","a1")。在 www.baidu.com，是无法访问到这个 cookie 的，因为 domain 无法完全匹配上。

而我们在设置了具名的 domain，比如 setCookie("a","a3", "domain=.www.baidu.com") 和 setCookie("a","a3", "domain=.www.baidu.com") 时，由于 host-only-flag 为 false，尽管多了一个 .，这两者也会相互覆盖。