
Cookie の基本
Cookie の仕組みを理解するのに役立つガイド、デモ、ツール。
Cookie とは
HTTP Cookie について理解します。ウェブサーバーによって設定され、ウェブブラウザによって保存および送信される仕組みを学びます。
サードパーティ Cookie
サードパーティ Cookie は、アクセスしているサイトとは異なるサイトから送信されます。具体的にはどのような利点があるのでしょうか。
Cookie のブロック
Cookie は、ブラウザの設計、エンタープライズ ポリシー、ユーザーの選択によってブロックされる場合があります。この記事では、その方法について説明します。
Cookie ツール
サイトでの Cookie の使用状況を把握するのに役立つ Chrome ツール。
詳細
Cookie の属性
Cookie には、Cookie の設定と有効期限を制御する属性を含めることができます。
HTTP リクエストとレスポンス
ウェブは HTTP プロトコルを使用してリソースを転送し、Cookie を設定します。仕組み
Cookie のデモ
ファーストパーティ Cookie、サードパーティ Cookie、クロスサイト トラッキング。
基本的な Cookie
デモ
ファーストパーティ Cookie のデモ
Cookie は、デモページの画像と iframe のリクエストに応答して設定されます。
👉? 1pc.glitch.me
👉? 1pc.glitch.me
サードパーティ Cookie のデモ
デモページには、別の(サードパーティ)サイトの画像と iframe が含まれています。
👉? 3pc.glitch.me
👉? 3pc.glitch.me
JavaScript Cookie のデモ
このページに含まれる JavaScript によって Cookie が設定されます。
👉? javascript-cookie.glitch.me
👉? javascript-cookie.glitch.me
SameSite Cookie のデモ
どちらのサイトも、デフォルトの SameSite 値 Lax を使用して、リクエストに応答して Cookie を設定します。
👉? samesite-a.glitch.me
👉? samesite-b.glitch.me
👉? samesite-a.glitch.me
👉? samesite-b.glitch.me
Cookie トラッキング
デモ
クロスサイト Cookie トラッキングのデモ
トラッキング ピクセルのデモ
どちらのページにも 1 ピクセルの画像が含まれています。この画像により、Cookie を使用して、画像を含むサイトでのアクティビティをトラッキングできます。
👉? tracking-pixel-a.glitch.me
👉? tracking-pixel-b.glitch.me
👉? tracking-pixel-a.glitch.me
👉? tracking-pixel-b.glitch.me
Cookie の取得デモ
このページに含まれる JavaScript は、クロスサイトの fetch() 呼び出しを行い、レスポンスで Cookie を設定します。
👉? fetch-cookie.glitch.me
👉? fetch-cookie.glitch.me