サードパーティ Cookie が有効かどうかテストする

1. このページの目的

javascript - Check if third-party cookies are enabled - Stack Overflow で紹介されているやり方をやってみる。

やっていること

1. 外部ドメインページの JavaScriptファイルを読み込む (scriptタグで読み込む)。
   • 実際はPHPのページになっており、ここでクッキーを発行している。
   • 更に、ローカルに定義されている JavaScript関数 (window._3rd_party_test_step1_loaded) を実行させている。
2. window._3rd_party_test_step1_loaded関数では、動的に script タグを生成して、もう1つの外部ドメインJavaScripファイルを読み込ませる。
   • こちらも実際は PHP のページになっており、先程発行したクッキーがブラウザから送信されたか調べている。
   • その結果を、ローカルに定義されている JavaScript関数 (window._3rd_party_test_step2_loaded) に渡して実行する。
3. window._3rd_party_test_step2_loaded 関数では、受け取った結果を画面に出力する。

修正点

Cookie をセットする処理において Samesite属性に明示的にNoneをセットしないと、ブラウザレベルでクロスドメインへの Cookie送信を止めてしまう。

今回 サードパーティとして利用しているWebサーバーは PHP 7.2 を使っているので、以下のようにして Samesite属性を指定する必要がある。

step1.js.php

setcookie('third_party_c_t', 'hey there!', time() + 3600*24*2, '/; SameSite=None');

step2.js.php

setcookie('third_party_c_t', '', time() - 3600*24, '/; SameSite=None');

参考

• HTTP クッキーをより安全にする SameSite 属性について (Same-site Cookies) | ラボラジアン

2. デモ

結果： Testing…

エラー： (If this message persists, the test could not be completed; we could not reach the third-party to test, or another error occurred.)

3. メモ

• ブラウザでサードパーティCookieをブロックする設定にした場合、(HTTPの) Set-Cookie レスポンスヘッダは送信されるが、Cookie リクエストヘッダが送信されなくなる。
• Chrome 開発者ツール [Network] タブでは、なぜかサードパーティCookie に関する Set-Cookie ヘッダや Cookie ヘッダが表示されない。Firefox のツールなら表示される。