Disqus的iframe如何根据其内容调整其大小？

Question

下面是一个示例：http://www.npr.org/blogs/thetwo-way/2013/04/04/176224703/why-can-lance-armstrong-race-at-a-swim-meet

向下滚动到注释。 Discus在页面上插入iframe，然后将注释加载到iframe中。

不知何故，iframe知道它的内容有多高，并且它扩展到它所插入页面上的高度。

有谁知道这是可能的？尤其令人困惑的是，Disqus的iframe是一个不同的域名，所以我不知道脚本如何检测其内容。

Answer 1

Disqus正在使用postMessage()发送消息从iframe返回主机页面。如果你通过他们的主要iframe中的JavaScript代码和搜索“的postMessage”你会发现这段代码（原已经过压缩，在这里重新格式化）：

DISQUS.define("Bus", function() { 
    function e(a) { 
     a = a.split("/"); 
     return a[0] + "//" + a[2] 
    } 
    var g = DISQUS.use("JSON"), 
     c = window.location.hash.slice(1), 
     b = window.opener || window.parent, 
     h = document.referrer, 
     f = {}; 
    f.client = e(document.location.href); 
    f.host = h ? e(h) : f.client; 
    return { 
     origins: f, 
     messageHandler: function(a) { 
      var b; 
      try { 
       b = DISQUS.JSON.parse(a.data) 
      } catch (c) { 
       return 
      } 
      if (!(b.name[0] === "!" && a.origin !== f.client)) switch (b.scope) { 
      case "client": 
       DISQUS.Bus.trigger(b.name, b.data) 
      } 
     }, 
     postMessage: function(a) { 
      a.sender = c; 
      a = g.stringify(a); 
      b.postMessage(a, "*") 
     }, 
     sendHostMessage: function(a, b) { 
      b = b || []; 
      DISQUS.Bus.postMessage({ 
       scope: "host", 
       name: a, 
       data: b 
      }) 
     }, 
     sendGlobalMessage: function(a, b) { 
      b = b || []; 
      DISQUS.Bus.postMessage({ 
       scope: "global", 
       name: a, 
       data: b 
      }) 
     } 
    } 
}); 
_.extend(DISQUS.Bus, Backbone.Events); 
$(document).ready(function() { 
    var e = window.addEventListener ? window.addEventListener : window.attachEvent, 
     g = window.addEventListener ? "message" : "onmessage"; 
    if (!e) throw Error("No event support."); 
    e(g, DISQUS.Bus.messageHandler, !1); 
    window.onunload = function() { 
     DISQUS.Bus.sendHostMessage("die") 
    } 

采用Bus这里是有道理的：“在计算机体系结构中，总线是一个在计算机内部组件或计算机之间传输数据的子系统。“ （Wikipedia）

我期望看到东西加载到主机页面中，就像设置事件监听器的代码的最后一部分，尽管我没有通过加载到主机的脚本的粗略搜索找到它页。

另请参阅Resizing an iframe based on content了解适用于旧版浏览器的相关技术。