包含facebook連接函數的外部鏈接？

我剛開始玩Facebook API。我有一個基本的「地獄世界」應用程序，只顯示登錄用戶名。當我有FB.init（）函數內聯（顯示「使用Facebook登錄」按鈕並工作）時，它工作得很好。然而，我試圖創建一個名爲「Facebook.js」的JS文件，並將init（）放在那裏，現在我只看到「使用Facebook登錄」的純文本，顯然它不起作用。包含facebook連接函數的外部鏈接？

可以做到這一點嗎？我錯過了一些愚蠢的東西嗎？（可能是兩者）

[------------- index.aspx ---------------------- -------------------------------------]

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title>Scott's test application</title> 
    <script src="JS/jquery-1.6.4.min.js" type="text/javascript"></script> 
    <script src="http://connect.facebook.net/en_US/all.js" type="text/javascript"></script> 
    <script src="JS/facebook.js" type="text/javascript"></script> 
</head> 
<body> 
    <div id="fb-root"></div> 
    <div>Welcome <span id="guest" class="UserNameWelcome">Guest</span><span id="name" class="UserNameWelcome"></span>!</div> 
    <div><img src="" alt="Avatar" id="image"/></div> 
    <fb:login-button>Login with Facebook</fb:login-button> 
</body> 
</html>

[ - ----------- facebook.js ------------------------------------ -----------------------]

FB.init({ 
    appId: 'myappid', cookie: true, 
    status: true, xfbml: true 
}); 
FB.api('/me', function (user) { 
    if (user != null) { 
     var image = document.getElementById('image'); 
     image.src = 'https://graph.facebook.com/' + user.id + '/picture'; 
     var name = document.getElementById('name'); 
     name.innerHTML = user.name 
    } else { 
     $('#image').hide(); 
     $('#name').hide(); 
    } 
});

來源

2011-10-15 Scott Beeson

您不必擁有所有內容，但是您必須確保all.js在您調用任何FB函數之前完全加載。在facebook.js裏面，你可以將FB.init和FB.api調用封裝到一個名爲start_fb（）的函數中，然後從window.onload或window.fbAsyncInit事件處理函數中調用start_fb。當all.js完成加載時，fbAsyncInit自動觸發，但window.onload稍微安全一些，因爲它也確保所有的dom元素都像fb-root一樣在位。

來源

2011-10-15 22:07:52

您可以使用您的Facebook.js的Facebook's JavaScript SDK 裹含量W異步加載器第i個window.fbAsyncInit功能

window.fbAsyncInit = function() { 
    // Your code goes here 
} 

// Load the SDK Asynchronously 
(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));

來源

2011-10-15 21:21:43

可選地，您可以跳過* Facebook.js *中的異步加載部分，並在加載* Facebook.js *之後引用JavaScript SDK，如下所示：' –

顯然，一切都必須在身體（？），並以正確的順序...下面的HTML似乎做什麼我期望的那樣。

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title>Scott's test application</title> 
    <script src="JS/jquery-1.6.4.min.js" type="text/javascript"></script> 
    <link href="CSS/site.css" rel="stylesheet" type="text/css" /> 
</head> 
<body> 
    <div id="fb-root"></div> 
    <script src="http://connect.facebook.net/en_US/all.js" type="text/javascript"></script> 
    <script src="JS/facebook.js" type="text/javascript"></script> 
    <div>Welcome <span id="guest" class="UserNameWelcome">Guest</span><span id="name" class="UserNameWelcome"></span>!</div> 
    <img src="" alt="Avatar" id="image"/> 
    <fb:login-button>Login with Facebook</fb:login-button> 
    <div id="version">v0.01</div> 
</body> 
</html>

來源

2011-10-15 21:32:08

包含facebook連接函數的外部鏈接？

回答

相關問題