我正在写一个基于iframe的facebook应用程序。现在我想使用相同的html页面来渲染正常的网站以及facebook内的画布页面。我想知道我是否可以确定页面是否已经在iframe内加载或直接在浏览器中加载?


当前回答

function amiLoadedInIFrame() {
    try {
         // Introduce a new propery in window.top
         window.top.dummyAttribute = true;
         // If window.dummyAttribute is there.. then window and window.top are same intances
         return !window.dummyAttribute;
    } catch(e) {
         // Exception will be raised when the top is in different domain
         return true;
    }
}

其他回答

function amiLoadedInIFrame() {
    try {
         // Introduce a new propery in window.top
         window.top.dummyAttribute = true;
         // If window.dummyAttribute is there.. then window and window.top are same intances
         return !window.dummyAttribute;
    } catch(e) {
         // Exception will be raised when the top is in different domain
         return true;
    }
}

在Firefox 6.0扩展(Addon-SDK 1.0)的内容脚本中,接受的答案对我来说不起作用:Firefox在每个:顶级窗口和所有iframe中执行内容脚本。

在内容脚本中,我得到以下结果:

 (window !== window.top) : false 
 (window.self !== window.top) : true

这个输出的奇怪之处在于,无论代码是在iframe中运行还是在顶级窗口中运行,它总是相同的。

另一方面,谷歌Chrome似乎只在顶级窗口内执行我的内容脚本一次,所以上面不会工作。

在两种浏览器的内容脚本中,最终为我工作的是:

 console.log(window.frames.length + ':' + parent.frames.length);

如果没有iframe,则打印0:0,在包含一个框架的顶级窗口中打印1:1,在文档的唯一iframe中打印0:1。

这允许我的扩展在两个浏览器中确定是否存在任何iframes,此外,在Firefox中,如果它是在iframes之一中运行。

由于您是在facebook应用程序的上下文中请求,您可能想要考虑在初始请求发出时在服务器上检测这一点。如果从iframe调用,Facebook将传递一堆查询字符串数据,包括fb_sig_user键。

因为你可能需要在你的应用程序中检查和使用这些数据,所以使用它来确定要渲染的适当上下文。

if ( window !== window.parent ) 
{
      // The page is in an iframe   
} 
else 
{     
      // The page is not in an iframe   
}

我以前经常检查窗户。父键对我有用,但最近window是一个循环对象,总是有父键,不管有没有iframe。

正如评论所言,很难与窗口相比。父母工作。不确定这是否会工作,如果iframe是完全相同的网页作为父母。

window === window.parent;