Set-CookieのSameSite属性のエラーについて


SameSiteエラーまとめ

GoogleChromeの開発ツールで表示されるSameSiteのエラーについてまとめました(これ以外にもあると思います)

This Set-Cookie was blocked because it had the "Secure" attribute but was not received over a secure conenection.

翻訳: 「このセットクッキーは、"Secure "属性を持っていますが、セキュアな接続で受信されなかったため、ブロックされました」。

対処: 対象のcross-siteがhttps対応しているか確認する。

This Set-Cookie was blocked because it had the "SameSite=None" attribute but did not have the "Secure" attribute, which is required in order to user "SameSite=None".

翻訳: 「このSet-Cookieは、"SameSite=None "属性を持ちながら、"SameSite=None "を利用するために必要な "Secure "属性を持っていなかったため、ブロックされました。」

対処: Cookieをセットする際、 secure を付与しているか。例. Set-Cookie: hoge=fuga; Secure

This Set-Cookie was blocked because it had the "SameSite=Lax" attribute but came from a cross-site response which was not the response to a top-level navigation.

翻訳:「このセットクッキーは、"SameSite=Lax "属性を持っていたが、トップレベルのナビゲーションへの応答ではないクロスサイトの応答から来ていたため、ブロックされました。」

対処: Laxの場合、cross-siteに対してページ内遷移以外のGETリクエストはCookieが送信されない。HTML内部で画像をcross-siteから読み込んだり、JSでcross-siteから読み込んだりすることは出来ない。

用語の意味合い

top-level navigation

いわゆるブラウザのURLバーに表示されているURLのこと

cross-site

上記以外のURLのこと。サブドメインは違ってもOK
例えば、http://www.hoge.com がtop-levelだとすると、
http://blog.hoge.com はcross-siteにはあたらない。同じサイト(same-site)として扱われる。
http://www.fuga.com はcross-siteにあたる。

same-site

top-level のサイトのこと。

下記サイトが詳しいです。
https://web.dev/same-site-same-origin/