带有 AJAX 加载页面的“发送”按钮不起作用

Posted 2023-03-14

【中文标题】带有 AJAX 加载页面的“发送”按钮不起作用

【英文标题】："Send" button with AJAX loading page would not work

【发布时间】：2012-07-29 14:02:59

【问题描述】：

我对“发送”/“赞”按钮有一个典型的问题。 我的页面包含使用 ajax 请求动态更新的内容。 因此，更新后，我的“发送按钮”不起作用。 按钮代码：

<div class="fb-send" data-href="$server/book.html?currBookId=$book.id_book"
                             style="margin-top: 5px;"></div>

包含all.js文件的标准代码：

<script type="text/javascript">(function(d, s, id) 
if (d.getElementById(id)) return;
var js, fjs = d.getElementsByTagName(s)[0];
js = d.createElement(s);
js.id = id;
var lang = "$lang";
js.src = "//connect.facebook.net/en_US/all.js'#xfbml=1&appId=$fb_id";
fjs.parentNode.insertBefore(js, fjs);
(document, 'script', 'facebook-jssdk'));</script>

我试图在这里找到答案并找到了解决方案： *** solution post

我应该添加这个：

 try
            FB.XFBML.parse();
         catch(ex) 

在 AJAX 调用之后。 但！！ 它不工作！按钮现在在 Chrome 浏览器中绘制，但在控制台中我遇到了很多错误，例如：

 Unsafe JavaScript attempt to access frame with URL http://localhost:8080/catalog.html
 from frame with URL http://www.facebook.com/plugins/send.php?api_key=API-
 KEY&channel=http%3A%2F%2Fstatic.ak.facebook.com%2Fconnect%2Fxd_arbiter.php%3Fversion
 %3D9%23cb%3Df847c7b0c%26origin%3Dhttp%253A%252F%252Flocalhost%253A8080%252Ff8c34834
 c%26domain%3Dlocalhost%26relation%3Dparent.parent&colorscheme=light&
 extended_social_context=false&href=http%3A%2F%2FMySite.com
 %2Fbook.html%3FcurrBookId%3D2668&locale=ru_RU&sdk=joey. 
 Domains, protocols and ports must match.

而且按钮不起作用。在 FF 中按钮不可见（这意味着解决方案在 FF 中不起作用）

您有什么想法可以解决这个问题吗？

【问题讨论】：

我使用来自 facebook javascript SDK 的 FB.ui 而不是标准的“发送”按钮。但我仍然对解决上面描述的问题感兴趣。

【参考方案1】：

我也遇到了异步使用 Like 按钮的问题。

我使用不同的代码来包含 all.js 和使用 FB.init（由 js.src = "//connect.facebook.net/en_US/all.js'#xfbml=1&appId=$fb_id" 完成）。

这是我使用的：

/* Ajax stuff in order to generate like button in xfbml or html5 */

if (typeof(FB) != 'undefined' && FB != null ) 
    /* If FB.init has already been called, just parse like button */
    FB.XFBML.parse(document.getElementById('<YOUR-ID>'));
    /* You can also use FB.XFBML.parse() in order to parse the whole DOM, but I advise to integrate the Like / Send button into a div and parse it after */
else                       
    window.fbAsyncInit = function () 
            FB.init( appId: <YOUR-APP-ID>, cookie: true, xfbml: true, oauth: true );
            /* FB stuff here, e.g. FB.event.suscribe */
    ;      
    // Just load the script, no FB.init
    (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));

它非常适合我。

关于错误（Unsafe Javascript ...），它应该出现在 Chrome 中，而不是 FireFox。它是特定于 Chrome 的，并且因为您正在集成来自另一个域（FaceBook）的 iFrame 而被触发。 AFAIK，没有办法解决这个错误。希望这会有所帮助。