Facebook 如何为画布页面上的 iFrame 设置跨域 cookie?
我正在浏览 Facebook 的文档,阅读有关画布应用程序的内容,并遇到了一个示例应用程序:http://developers。 facebook.com/docs/samples/canvas。然而,当我阅读他们的示例时,我对他们在 iframe 应用程序中使用 cookie 感到非常困惑。
一些背景故事...
我已经尝试过使用 iframe 来实现可嵌入的小部件(与 Facebook 无关),并且我发现一些浏览器(Chrome、Safari 等)具有严格的 cookie 策略,并且不允许跨域 cookie在 iframe 中设置(另一方面,Firefox 允许 iframe 在 iframe 中设置跨域 cookie)。例如,如果 foo.com 有一个带有 src="http://bar.com/widget"
的 iframe,则 iframe 小部件将无法为 bar.com 设置任何 cookie,因此将具有在 iframe 中持久保存状态的问题:bar.com 会将来自小部件的每个请求(包括 ajax 请求)解释为没有已建立会话的新请求。我苦苦挣扎,找到了解决这个问题的方法,即使用 JSONP 和 javascript 为 foo.com 设置 cookie...
...等等?
好吧,我正在查看示例 canvas iframe Facebook 应用程序,我注意到他们的应用程序(托管在 runwithfriends.appspot.com 上)能够设置一个 cookie,u
,其中包含当前用户的 id 以及runwithfriends.appspot.com 域的其他一些参数。它会在每次请求时发送这个 cookie...并且它在 Chrome 和 Firefox 中都可以工作!搞什么? Facebook 如何绕过 Chrome 上的跨域 cookie 限制?
(我现在已经知道答案了,但我认为这可能对那些努力找出同样问题的人有帮助——我将在下面发布答案。)
I was browsing Facebook's documentation reading about canvas applications and I came across an example application: http://developers.facebook.com/docs/samples/canvas. As I read through their example, however, I got very confused about their use of cookies in the iframe application.
A little backstory...
I had already played around with using iframes for embeddable widgets (unrelated to Facebook) and I found out a few browsers (Chrome, Safari, etc.) have strict cookie policies and don't allow cross-domain cookies set in iframes (Firefox, on the other hand, allows iframes to set cross-domain cookies in iframes). For example, if foo.com has an iframe with src="http://bar.com/widget"
the iframe widget will not be able to set any cookies for bar.com and therefore will have trouble persisting state within the iframe: bar.com will interpret every request (including ajax requests) from the widget as a fresh request without an established session. I struggled, and found a way around this by using JSONP and javascript to set cookies for foo.com instead...
... and so?
Well, I was looking at the example canvas iframe Facebook application and I noticed that their application (hosted on runwithfriends.appspot.com) is able to set a cookie, u
, with the current user's id along with a few other parameters for the runwithfriends.appspot.com domain. It sends this cookie with every request... and it works in both Chrome and Firefox! WTF? How does Facebook get around the cross-domain cookie restrictions on Chrome?
(I already know the answer now, but I thought this might be helpful for anyone struggling to figure out the same thing -- I'll post the answer below.)
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
因此,iFrame 实际上并未为 runwithfriends.appspot.com 域设置
u
cookie。 Facebook 所做的是创建一个表单So the iFrame isn't actually setting the
u
cookie for the runwithfriends.appspot.com domain. What Facebook does is it creates a form,<form action="runwithfriends.appspot.com/..." target="name_of_iframe" method="POST">
and uses javascript to submit the form on page load. Since the form's target is the iframe, it doesn't reload the page... it just loads the iframe with the POST's response. Apparently even Chrome and other browsers with strict cookie policies set cookies for cross domain requests if they are POST requests...