javascript - 为什么 Facebook JavaScript SDK 请求所有这些文件？

Question

我正在尝试优化 Facebook SDK 的使用。查看 Chrome 的网络选项卡后，我发现当 SDK 加载时，它会引入许多其他文件:

第一个是 all.js，它包含 Facebook API。屏幕截图中的其余资源在调用 FB.init 后加载。

about:blank 有 3 次调用，xd_arbiter.php 有 3 次调用。有 2 个调用 oauth。我不明白为什么有 3 个调用前两个。

似乎 all.js 创建了 2 个 iframe 元素(如果加载 SDK 的页面是通过 HTTPS 提供的，则只创建一个 - fb_xdm_frame_https 一个。在这种情况下，似乎发出了 2 个请求，而不是 3 个):

<div id="fb-root" class=" fb_reset">
    <div style="position: absolute; top: -10000px; height: 0px; width: 0px; ">
        <div></div>
        <div>
            <iframe id="fb_xdm_frame_http" name="fb_xdm_frame_http"></iframe>
            <iframe id="fb_xdm_frame_https" name="fb_xdm_frame_https"></iframe>
        </div>
    </div>
</div>

请求空白页是因为 iframe 元素是在没有 src 属性的情况下创建的(稍后通过 JavaScript 添加)。当它被设置时，它被设置为 xd_arbiter.php。

这就解释了 3 个中的 2 个。但是对 about:blank 和 xd_arbiter.php 的其他调用从何而来？通过 JSBeautifier 运行 all.js，我已经走到这一步了并遵循代码，但我不明白为什么或如何第三次请求这些文件。

Answer 1

xd_arbiter.php 是基础设施的一部分，用于促进您的页面与显示的所有后续小部件或对话框之间的跨域消息传递，或者如果用作 Canvas 页面，则为主要 Facebook 站点。

您看到对/dialog/oauth 的两个请求似乎与您的实现有关，除了设置 之外，您是否手动调用 FB.getLoginstatus(.., true)状态:真?

无论如何，xd_arbiter.php 的第三个请求只是对通过跨域 channel 返回的/dialog/oauth 请求的响应，并且由于 xd_arbiter.php 资源被缓存(你似乎禁用了缓存，正如上次对 xd_arbiter 的请求所证明的那样)没有真正产生实际成本。