Web制作、Web開発の歩き方

サーバー、データベース、インフラに関するトピックス

■第7話:Cookieの各種設定項目

(最終更新日:2023.01.22)

Cookieのイメージ
この記事は5分で読めます!
(絵が小さい場合はスマホを横に)

サードパーティクッキーの廃止、同一ドメインであってもCookieで情報を取得する場合はユーザーに同意を得るなど、 2019年頃ヨーロッパを中心に個人情報を取得する全ての情報に透明性を要求する動きが強まった。 それに伴い、各国それらの対応をしながらも、未だに同一ドメイン及びそれに関連するCookieは利用され続けている。 Cookieを用いることで、ログイン管理やカートの履歴保持などをサーバーと連携して行うことができ、ユーザーのスムースな操作をサポートするからだ。 今回はそんな便利なCookieについて紹介したいと思う。


Cookieとは

Cookieとはブラウザが持つデータ保存機能の一つで、訪問者が訪れたサイトの入力データや利用環境などを記録するものである。 Cookieを利用することで、ユーザーのログイン状態の保持、カートの状態の保持などができるようになる。 Cookie自体は4KBほどのテキストデータであり、1つのドメインで最大20個のCookieを保持することができる。 Cookieの中身はChromeの場合「Ctrl+Shift+I」でデベロッパーツールを開き、Applicationタブを選択、StorageのCookiesを選べば見ることができる。 100Byte前後のテキストデータであることが分かると思う。各種項目については次項で説明する。

ChromeでのCookieの確認

ChromeでのCookieの確認

Cookieの各種設定項目

■Name:Cookieの名前になる。これで他のCookieと区別をする。

■Value:Cookie自体の値。Emailやパスワード自体を保存する訳ではなく、 セッションIDやTokenなどを保持している。値としては、そのままでは意味の分からない文字列が羅列している。

■Domain:Cookieが使えるドメインを示す。

■Path:Cookieの有効範囲を示す。「/」であればそのドメイン全体で、あるパスが示されていればそのパス以下で有効となる。

■Expires/Max-Age:Cookieの有効期限。例えばカートに商品を入れたとしても、有効期限が切れればなくなる。

■HttpOnly:チェックがあるとJavaScriptでは読み込み、書き込みができない。XSSを防ぐためにも大事な情報は有効化することが重要。 ちなみにHttpOnly化はサーバー側で設定して行い、設定されたCookieはHTTPリクエストのヘッダーフィールドにセットし、サーバー側に送信して認証する。

■Secure:チェックがあると、http通信の際はブラウザにCookieを保存しない。暗号化されたhttps接続時にのみ、Cookieを送るようにする。 基本こちらはチェックする。

■SameSite:今開いているドメインから別ドメインにリクエストを送る場合、Cookieをセットするかどうかを指定する。StrictとLaxは基本Cookieをセットしない。 (LaxはGETメソッドの場合はセットできる。)現在のデフォルトはLaxになっている。基本はLaxの設定で良いと思う。 Noneは従来の他ドメインからCookieをセットできてしまう設定で、クロスサイトでJWTCookieを用いる場合などはNoneを選択し、Cookieをセットする。 その際、HttpOnlyとSecure属性のチェック、サーバー側のCORS設定(リクエストを許可するオリジンを限定すること)は行うようにする。

■SameParty:こちらは比較的新しい属性で、サードパーティクッキーの緩和が目的だ。 同一主体で運営されているドメインの異なるサイト間でのやりとりを許可するもので、 詳しくはこちらが参考になる。

■Partition Key:こちらも比較的新しい属性で、サードパーティクッキーの緩和が目的だ。将来的には3rdパーティクッキーをリクエストする際、 Parititioned属性のついたCookieのみが送信され、そうでないものは送信されないようになるとされている。 詳しくはこちらが参考になる。

まとめ

今回、Cookieの各種項目について説明した。 Cookieはインターネット黎明期から使用され、ユーザビリティの向上に貢献しつづけてきた。 一旦はサードパーティCookieが廃止される動きにあったとは言え、利便性を考えると今後もCookieは使われ続けるであろう。 サーバーサイドとフロントエンドを分断する流れ、それらをスムースにつなぐ役割としてもCookieは重要な役割を果たすはずだ。 今後の動きに注目しつつ、変化した仕様にあった実装を進めていこう。

▼参考図書、サイト

   Cookieで指定可能な属性の種類と設定方法  JavaDrive
   Cookieの利便性と問題点を考える  ESET/サイバーセキュリティ情報局
   Cookieの新しい属性、SameParty属性について  ASnoKaze blog
   トラッキングに利用できない3rdパーティクッキー「CHIPS」の仕組み (partitioned属性)  ASnoKaze blog
   CookieのSameSite属性で「防げるCSRF」と「防げないCSRF」  まったり技術ブログ