SameSite Cookie属性とは？初心者向けにわかりやすく解説！設定方法と注意点
投稿日：
更新日：
SameSite Cookie属性とは？なぜ必要なのか
Cookie（クッキー）とは？
まず、SameSite Cookie属性を理解する前に、Cookie（クッキー）について簡単に説明します。Cookieとは、Webサイトがユーザーのブラウザに保存する小さなテキストデータのことです。Webサイトは、このCookieを使って、ユーザーのログイン状態を維持したり、好みを記憶したりすることができます。 例えば、ECサイトで商品をカートに入れた後、別のページに移動してもカートの中身が保持されているのは、Cookieのおかげです。SameSite Cookie属性の役割
SameSite Cookie属性は、このCookieのセキュリティを強化するための仕組みです。具体的には、クロスサイトリクエストフォージェリ（CSRF）攻撃というセキュリティリスクを軽減する役割があります。 クロスサイトリクエストフォージェリ（CSRF）攻撃とは、悪意のあるWebサイトが、ユーザーがログインしている別のWebサイトに対して、ユーザーの意図しないリクエストを送信する攻撃のことです。 例えば、ユーザーが銀行のWebサイトにログインしている状態で、悪意のあるWebサイトを開いてしまうと、そのWebサイトから銀行のWebサイトに対して、不正な送金リクエストが送信される可能性があります。 SameSite Cookie属性を設定することで、このようなCSRF攻撃のリスクを大幅に軽減することができます。なぜSameSite Cookie属性が必要なのか？
従来のCookieは、異なるWebサイトからのリクエストにも自動的に付与されていました。これは便利な反面、CSRF攻撃のリスクを高める原因となっていました。 SameSite Cookie属性は、CookieがどのWebサイトからのリクエストに付与されるかを制御することで、CSRF攻撃を防ぎます。つまり、Cookieの安全性を高めるために、SameSite Cookie属性は非常に重要な役割を担っているのです。SameSite Cookie属性の3つの設定値：Strict、Lax、None
SameSite Cookie属性には、Strict、Lax、Noneという3つの設定値があります。それぞれの設定値によって、Cookieの挙動が異なります。
Strict：最も厳格な設定
Strictは、最も厳格な設定です。この設定の場合、Cookieは、同じWebサイトからのリクエストにのみ付与されます。つまり、別のWebサイトからのリクエストには、一切Cookieが付与されません。
例えば、example.comというWebサイトでStrict属性が設定されたCookieは、example.comからのリクエストにのみ付与され、evil.comのような別のWebサイトからのリクエストには付与されません。
Strictは、セキュリティを最優先する場合に最適な設定ですが、利便性が低下する可能性があります。例えば、別のWebサイトからのリンクをクリックしてexample.comにアクセスした場合、ログイン状態が維持されないことがあります。
Lax：利便性とセキュリティのバランス
Laxは、Strictよりも緩やかな設定です。この設定の場合、Cookieは、同じWebサイトからのリクエストと、トップレベルナビゲーション（GETリクエスト）に付与されます。
トップレベルナビゲーションとは、ブラウザのアドレスバーにURLを入力したり、ブックマークからWebサイトにアクセスしたりするような、ユーザーが直接Webサイトにアクセスする操作のことです。
例えば、example.comというWebサイトでLax属性が設定されたCookieは、example.comからのリクエストと、ユーザーがブラウザのアドレスバーにexample.comと入力してアクセスした場合に付与されます。しかし、evil.comのような別のWebサイトからのフォーム送信（POSTリクエスト）には付与されません。
Laxは、利便性とセキュリティのバランスが取れた設定であり、多くのWebサイトで推奨されています。
None：最も緩やかな設定
Noneは、最も緩やかな設定です。この設定の場合、Cookieは、すべてのリクエストに付与されます。つまり、別のWebサイトからのリクエストにもCookieが付与されます。
Noneを使用する場合は、必ずSecure属性も設定する必要があります。Secure属性は、CookieがHTTPS接続でのみ送信されるようにするための属性です。
NoneとSecureを組み合わせることで、クロスサイトでのCookieの利用が可能になりますが、CSRF攻撃のリスクが高まるため、注意が必要です。
Noneは、クロスサイトでのCookieの利用がどうしても必要な場合にのみ使用し、それ以外の場合はStrictまたはLaxを使用することを推奨します。
SameSite Cookie属性を設定する際の注意点と具体的なコード例
SameSite Cookie属性を設定する際には、いくつかの注意点があります。- ブラウザの互換性: 古いブラウザではSameSite Cookie属性に対応していない場合があります。そのため、古いブラウザをサポートする必要がある場合は、ポリフィル（polyfill）と呼ばれる技術を使用する必要があります。
- 設定値の選択:
Strict、Lax、Noneのいずれの設定値を選択するかは、Webサイトの要件によって異なります。セキュリティを最優先する場合はStrict、利便性を重視する場合はLax、クロスサイトでのCookieの利用が必要な場合はNoneを選択します。 NoneとSecureの組み合わせ:Noneを使用する場合は、必ずSecure属性も設定する必要があります。Secure属性を設定しないと、Cookieが安全でないHTTP接続で送信される可能性があり、セキュリティリスクが高まります。
const express = require('express');
const app = express();
app.get('/set-cookie', (req, res) => {
// SameSite属性を設定したCookieを送信
res.cookie('myCookie', 'cookieValue', {
sameSite: 'Lax', // または 'Strict'、'None'
secure: true, // HTTPSでのみ送信する場合
httpOnly: true, // JavaScriptからのアクセスを禁止する場合
});
res.send('Cookieが設定されました');
});
app.listen(3000, () => {
console.log('サーバーがポート3000で起動しました');
});
res.cookie()関数のオプションで、sameSite属性とsecure属性を設定しています。
-
sameSite: CookieのSameSite属性を設定します。Lax、Strict、Noneのいずれかの値を指定します。 -
secure: CookieをHTTPS接続でのみ送信するかどうかを設定します。trueまたはfalseを指定します。 -
httpOnly: JavaScriptからのCookieへのアクセスを禁止するかどうかを設定します。trueまたはfalseを指定します。trueに設定すると、XSS（クロスサイトスクリプティング）攻撃のリスクを軽減できます。
まとめ
この記事では、SameSite Cookie属性について、以下のことを学びました。- SameSite Cookie属性は、CSRF攻撃のリスクを軽減するための重要なセキュリティ対策である。
- SameSite Cookie属性には、
Strict、Lax、Noneという3つの設定値があり、それぞれCookieの挙動が異なる。 Noneを使用する場合は、必ずSecure属性も設定する必要がある。- SameSite Cookie属性を設定する際には、ブラウザの互換性や設定値の選択に注意する必要がある。