javascript - 如何将 Facebook 对话框放在自定义模式/html 中

Question

我有一个 Facebook 模态对话框，我想将其放置在自定义模态对话框中(作为 html 元素)。这是我到目前为止所拥有的:

对于 Facebook 对话:

$(document).ready(function(){
window.fbAsyncInit = function () {
    FB.init({ appId: '***************', cookie: true, xfbml: true, oauth: true });

    // *** here is my code ***
    if (typeof facebookInit == 'function') {
        facebookInit();
    }
};

(function(d){
    var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
    js = d.createElement('script'); js.id = id; js.async = true;
    js.src = "//connect.facebook.net/en_US/all.js";
    d.getElementsByTagName('head')[0].appendChild(js);
}(document));

function facebookInit() {
   FB.ui({
    url : 'http://www.google.com',
    method: 'feed',
    name: 'The name',
    link: 'crowd.com',
    caption: 'An example caption',
}, function (response) {
    if (response && response.post_id) {
        alert('Post was published.');
    } else {
        alert('Post was not published.');
    }
}); 
}
});

对于模态:

<div id="myModal1new" class="modal1 hide welcome-modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
</div>

<div class="modal-header"></div>
            <div class="modal-body">
                <div id="fb-root"></div>
            </div>

我是否可以将这两者结合起来(将 FB 对话框放在自定义模式中)？也许有各种各样的 iframe？提前谢谢你。

Answer 1

坏消息你不能那样做，facebook 有所有用于分享的 url，比如 sharer.php 和 url 的 feed 对话框，比如这个:

https://www.facebook.com/dialog/feed?
  app_id=145634995501895
  &display=page&caption=An%20example%20caption 
  &link=https%3A%2F%2Fdevelopers.facebook.com%2Fdocs%2Fdialogs%2F
  &redirect_uri=https://developers.facebook.com/tools/explorer

不会在 iframe 内呈现，因为 facebook 阻止了它的所有内容在 iframe 内呈现。这是当您尝试创建包含 Facebook 内容的 iframe 时抛出的错误:

Refused to display 'https://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fwww.google.com' in a frame because it set 'X-Frame-Options' to 'DENY'.

由于您不能使用 iframe 并且提要对话框每次都会打开一个新窗口，因此您可以完成类似操作的唯一方法是创建您自己的“共享对话框”，但请记住，要做到这一点，您必须请求用户代表他们发帖的权限。