简体   繁体   English

如何处理Facebook javascript SDK事件?

[英]How to handle Facebook javascript SDK events?

I have a javascript code that should execute some functions using Facebook API . 我有一个JavaScript代码,应该使用Facebook API执行一些功能。

According to the documentation I'm including the SDK as follows. 根据文档,我包括以下SDK。 This code is included in a template for all the pages of my web application. 此代码包含在我的Web应用程序所有页面的模板中。 (A template in my case is something that is added to all the pages...) (就我而言,模板是添加到所有页面中的东西...)

window.fbAsyncInit = function() {
  FB.init({
    appId            : 'xxx',
    autoLogAppEvents : true,
    xfbml            : true,
    version          : 'v2.10'           
  });

  jQuery('.FacebookLoadingFlag').trigger('facebook:init');
  FB.AppEvents.logPageView();                        
};

Now, on every page whenever I need to call a Facebook function, I try to execute it once the SDK initialized as follows: 现在,每当我需要调用Facebook函数时,只要SDK初始化如下,我都会尝试执行它:

window.onload = function() {           
  $(".FacebookLoadingFlag").bind("facebook:init", function() {   
    // code here
  });
}

This implementation doesn't work well because sometimes the SDK got initialized and the whole page is not loaded yet, so the event facebook:init fires before it gets an event handler. 此实现效果不佳,因为有时会初始化SDK,并且尚未加载整个页面,所以事件facebook:init会在获取事件处理程序之前触发。 Hence the code doesn't execute. 因此,代码无法执行。

If I remove window.onload , I sometimes get the error saying that jQuery was not found. 如果删除window.onload ,有时会收到错误消息,指出未找到jQuery。 It means jQuery was not loaded yet. 这意味着尚未加载jQuery。

In both cases very often the code doesn't execute. 在这两种情况下,代码通常都不会执行。

Does anyone have an idea on when to execute this code and be sure it will always be executed? 有谁知道何时执行此代码并确定将始终执行? I'm new to Javascript and I don't know how to handle events. 我是Java语言的新手,我不知道如何处理事件。

I think you should be following this tutorial, that's jQuery specific: 我认为您应该遵循本教程,该教程特定于jQuery:

https://developers.facebook.com/docs/javascript/howto/jquery/v2.10 https://developers.facebook.com/docs/javascript/howto/jquery/v2.10

From the tutorial: 从教程中:

In this tutorial, you'll learn how to incorporate the Facebook JavaScript SDK into your jQuery-based web app. 在本教程中,您将学习如何将Facebook JavaScript SDK集成到基于jQuery的Web应用程序中。 Both jQuery and the JavaScript SDK provide their own solutions for deferring code execution until the libraries have loaded, and this tutorial will help you combine the two and ensure both are ready to use before you invoke the SDK. jQuery和JavaScript SDK都提供了自己的解决方案,用于将代码执行推迟到库加载之前,并且本教程将帮助您结合使用这两种方法,并确保在调用SDK之前它们都准备就绪。

The tutorial you are following instructions from is a generic one. 您遵循的指导教程是一个通用的教程。

According to the jQuery specific guide I linked above, your code should look like this: 根据我上面链接的jQuery特定指南,您的代码应如下所示:

<html>
<head>
  <script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
  <link rel="stylesheet" href="style.css" />
  <title>jQuery Example</title>
  <script>
    $(document).ready(function() {
      $.ajaxSetup({ cache: true });
      $.getScript('//connect.facebook.net/en_US/sdk.js', function(){
        FB.init({
          appId: '{your-app-id}',
          version: 'v2.7' // or v2.1, v2.2, v2.3, ...
        });
        // After initialization code here
        $('#loginbutton,#feedbutton').removeAttr('disabled');
        FB.getLoginStatus(updateStatusCallback);
      });
    });
  </script>
</head>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM