Facebook Javascript SDK错误“对象[object Object]没有方法'init'

Question

One of the first things that needs to be done in order to load the SDK for interacting with Facebook, is to run:

FB.init(params)

This method is used to initialize and setup the SDK. . . . . . All other SDK methods must be called after this one, because they won't exist until you do.

Facebook JavaScript SDK: .init()

I'm getting the error msg:

Object [object Object] has no method "init"

I'm not getting an error that FB is undefined, so I'm assuming that at least part of the Facebook Javascript SDK loaded.

When the SDK loads, Facebook puts contents into a <div> element: <div id="fb-root"></div>

Just for the fun of it, I used .innerHTML to see if I could extract anything out of that <div> .

var fbRootContent = document.getElementById('fb-root').innerHTML;
console.log("fbRoot Content: " + fbRootContent);

And it does show that something got injected into that <div> . So, . . . I'm assuming that at least some of the Facebook Javascript SDK loaded.

One possible issue, is that I'm using Google Apps Script, and lots of content gets sanitized and stripped out before it is served. So it's a possibility that, even though some of the SDK is loading, some of it is getting stripped out by the sanitation process.

I'm simply trying to determine if it's possible to load the Facebook Javascript SDK into Apps Script. I haven't had any luck so far. Here is the latest code I've used in the attempt to test whether the SDK can be loaded or not.

<div id="fb-root"></div>
<label id="lblToHid">Load Facebook Javascript SDK</label>

<br>
<br>
<button id="btnTest">test</button>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="https://connect.facebook.net/en_US/all.js"></script>

<script>
$(document).ready(function() {
$("#lblToHid").hide();
  $("#btnTest").click(function(){
  $("#lblToHid").show();
});

callFB();
fbAsyncInit();

});

function callFB(){
  console.log("callFB ran: ");
    window.fbAsyncInit = function() {
      console.log("AsyncInit ran");

  console.log("Here is the object FB: " + FB);

  var fbRootContent = document.getElementById('fb-root').innerHTML;
  console.log("fbRoot Content: " + fbRootContent);

    FB.init({
        appId      : 'myAppID Here',
        status     : true, // check login status
        cookie     : true, // enable cookies to allow the server to access the session
        oauth      : true, // enable OAuth 2.0
        xfbml      : true  // parse XFBML
      });

  console.log("callFB done running: ");

  };
};
</script>

Note that I am not loading the SDK asynchronously. I'm doing that on purpose to test if it will load or not. Note the line:

<script src="https://connect.facebook.net/en_US/all.js"></script>

Facebook suggests loading the SDK a different way. Why? Because it might slow down the initial load of your app.

So, why am I getting the error: Object [object Object] has no method "init"

And is it possible to load the Facebook Javascript SDK into Google Apps Script?

I'm using jQuery: $(document).ready ,

jQuery $(document).ready()

so FB.init shouldn't be getting called until the <script> tag has loaded the Facebook SDK.

Answer 1

Try changing your Facebook script import to this.

<script src="//connect.facebook.net/en_US/all.js#xfbml=1&appId={your-app-id}"></script>

Where {your-app-id} is your actual app id.

Update

Have you tried this.

function callFB(){
console.log("callFB ran: ");
window.fbAsyncInit = function() {
  console.log("AsyncInit ran");

FB.init({
    appId      : 'myAppID Here',
    status     : true, // check login status
    cookie     : true, // enable cookies to allow the server to access the session
    oauth      : true, // enable OAuth 2.0
    xfbml      : true  // parse XFBML
  });

console.log("Here is the object FB: " + FB);
 var fbRootContent = document.getElementById('fb-root').innerHTML;
console.log("fbRoot Content: " + fbRootContent);
console.log("callFB done running: ");

};
};