每個 Cookie 都包含一組鍵/值組合,以及多項屬性,可控制 Cookie 的使用時機和位置。
引進 SameSite
屬性 (如 RFC6265bis 所定義) 可讓您宣告 Cookie 僅供第一方或同網站使用。建議您先瞭解「網站」的意思。
網站是網域字尾和網域前的部分組合。例如,www.web.dev
網域是 web.dev
網站的一部分。
重要字詞:如果使用者位於 www.web.dev
,並向 static.web.dev
要求圖片,即為「相同網站」要求。
公開尾碼清單會定義系統將哪些網頁視為同一個網站。不只依附於頂層網域 (例如 .com
),還能包含 github.io
等服務。如此一來,your-project.github.io
和 my-project.github.io
就能將計算為不同的網站。
重要字詞:如果使用者位於 your-project.github.io
,並從屬於「跨網站」要求的 my-project.github.io
要求圖片。
使用 SameSite
屬性宣告 Cookie 使用情形
Cookie 上的 SameSite
屬性提供三種不同方式來控制這項行為。您可以選擇不指定屬性,也可以使用 Strict
或 Lax
將 Cookie 限制為只能接受相同網站要求。
如果將 SameSite
設為 Strict
,您的 Cookie 就只能在第一方情境下傳送。也就是說,Cookie 的網站必須與瀏覽器網址列中顯示的網站相符。因此,如果 promo_shown
Cookie 的設定如下:
Set-Cookie: promo_shown=1; SameSite=Strict
使用者進入您的網站時,系統會如預期傳送 Cookie 以及請求。
不過,如果使用者從另一個連結前往您的網站,系統就不會在初始要求中傳送 Cookie。這種做法適用於與一律須初始瀏覽功能有關的 Cookie 相關 Cookie (例如變更密碼或購物),但對 Cookie (例如 promo_shown
) 來說,這太嚴格了。如果讀者點選連結前往網站,他們會希望傳送 Cookie 以便套用偏好設定。
SameSite=Lax
可讓瀏覽器傳送含有這些頂層導覽的 Cookie。舉例來說,如果其他網站參照您的網站內容,在本例中,使用的是貓咪相片,並提供文章連結,如下所示:
<p>Look at this amazing cat!</p>
<img src="https://blog.example/blog/img/amazing-cat.png" />
<p>Read the <a href="https://blog.example/blog/cat.html">article</a>.</p>
在 Cookie 設為 Lax
的情況下,如下所示:
Set-Cookie: promo_shown=1; SameSite=Lax
當瀏覽器要求 amazing-cat.png
存取對方的網誌時,您的網站並不會傳送 Cookie。不過,當讀者點選網站的 cat.html
連結時,該要求會包含 Cookie。
建議您以這種方式使用 SameSite
,將會影響網站顯示的 Cookie 設定為 Lax
,並將與使用者動作相關的 Cookie 設定為 Strict
。
此外,您也可以將 SameSite
設為 None
,表明希望在所有情況下傳送 Cookie。如果您提供其他網站會使用到的服務,例如小工具、嵌入的內容、聯盟計畫、廣告或登入服務,請使用 None
以確保您的意圖明確。
未使用 SameSite 的預設行為變更
瀏覽器支援
- 80
- 86
- x
SameSite
屬性受到廣泛支援,但其尚未廣泛採用。過去,在未設定 SameSite
的情況下設定 Cookie,預設會在所有情況下傳送 Cookie,導致使用者容易受到 CSRF 攻擊,且不小心外洩的資訊外洩。為鼓勵開發人員說明意圖並提供更安全的體驗,IETF 提案「增量更好的 Cookie」制定了兩項重大異動:
- 系統會將沒有
SameSite
屬性的 Cookie 視為SameSite=Lax
。 - 具有
SameSite=None
的 Cookie 也必須指定Secure
,這代表它們需要安全的結構定義。
這兩項變更可回溯相容於已正確實作舊版 SameSite
屬性的瀏覽器,以及不支援舊版 SameSite
的瀏覽器。目的是讓 Cookie 行為和預定用途明確,進而降低開發人員對瀏覽器預設行為的依賴。所有無法辨識 SameSite=None
的用戶端都應忽略該回應。
預設使用 SameSite=Lax
如果您在傳送 Cookie 時未指定其 SameSite
屬性,瀏覽器會將該 Cookie 視為設為 SameSite=Lax
來處理。我們仍建議您明確設定 SameSite=Lax
,以提供更一致的瀏覽器使用者體驗。
「SameSite=None
」必須安全無虞
使用 SameSite=None
建立跨網站 Cookie 時,您也必須將 Cookie 設為 Secure
,瀏覽器才能接受這些 Cookie:
Set-Cookie: widget_session=abc123; SameSite=None; Secure
如要測試這項行為,您可以啟用 about://flags/#cookies-without-same-site-must-be-secure
和 Firefox 69,只要在 about:config
中設定 network.cookie.sameSite.noneRequiresSecure
。
此外,建議你盡快將現有的 Cookie 更新為 Secure
。
如果您依賴於網站上提供第三方內容的服務,請務必讓您的服務供應商更新 Cookie,並更新網站上的程式碼片段或依附元件,確保網站採用新行為。
SameSite
餅乾食譜
如需進一步瞭解如何更新 Cookie 以成功處理 SameSite=None
的異動,以及瀏覽器行為的差異,請參閱後續文章:SameSite Cookie 食譜。
感謝 Lily Chen、Malte Ubl、Mike West、Rob Dodson、Tom Steiner 和 Vivek Sekhar 的貢獻與意見回饋。
Cookie 主頁橫幅由 Pille-Riin Priske 在 Unsplash 上提供