1. ホーム
  2. cookies

FacebookはキャンバスページのiFrameにどのようにクロスドメインクッキーを設定するのですか?

2023-09-12 19:23:52

質問

Facebookのドキュメントでcanvasアプリケーションについて読んでいたところ、アプリケーションの例に出会いました。 http://developers.facebook.com/docs/samples/canvas . しかし、その例を読み進めるうちに、iframe アプリケーションでの Cookie の使用について非常に混乱してきました。

少し背景を説明すると...

私はすでに埋め込み可能なウィジェット (Facebook とは無関係) のために iframe を使って遊んでいましたが、いくつかのブラウザ (Chrome や Safari など) は厳格な Cookie ポリシーを持っていて、iframe に設定されたクロスドメイン Cookie を許可しないことがわかりました (一方、Firefox は iframe にクロスドメイン Cookie を設定することを許可しています)。例えば、foo.comがiframeに src="http://bar.com/widget" がある場合、iframe ウィジェットは bar.com に対してクッキーを設定することができないため、iframe 内で状態を持続させることができません。bar.com はウィジェットからのすべての要求(ajax 要求を含む)を、セッションが確立されていない新しい要求として解釈します。私は苦労して、JSONPとjavascriptを使用して、代わりにfoo.comのクッキーを設定することで、これを回避する方法を見つけました...

...そして、それで?

さて、私は例のキャンバス iframe Facebook アプリケーションを見ていて、彼らのアプリケーション (runwithfriends.appspot.com でホスト) がクッキーを設定することができることに気づきました。 u に、現在のユーザー ID と runwithfriends.appspot.com ドメインの他のいくつかのパラメータを設定することができます。このクッキーをすべてのリクエストで送信し、ChromeとFirefoxの両方で機能します。これはすごい。FacebookはどのようにしてChromeのクロスドメインCookieの制限を回避しているのでしょうか?

(私は今すでに答えを知っていますが、同じことを理解するのに苦労している人にとって、これは役に立つかもしれないと思いました -- 私は答えを下に投稿します)。

どのように解決するのですか?

つまり、iFrameは実際には u のクッキーを設定しているわけではありません。Facebookが行うのは、フォームを作成することです。 <form action="runwithfriends.appspot.com/..." target="name_of_iframe" method="POST"> というフォームを作成し、ページ読み込み時に javascript を使用してフォームを送信します。フォームのターゲットはiframeなので、ページを再ロードせず、POSTのレスポンスでiframeをロードするだけです。どうやら、Chromeやその他のCookieポリシーに厳しいブラウザでも、POSTリクエストであればクロスドメインのリクエストにCookieを設定するようです...。