2010-04-27 11 views
7

Ich versuche Facebook Connect auf einer Website zu implementieren. Ich versuche mit Javascript SDK von Facebok zu arbeiten. Ich bin neu dazu und leider sind die meisten Links in Facebook WIKI veraltet ... Wiederkehr 404 nicht gefunden. Auf jeden Fall habe ich diesen Code vor der Endung </body>:API Key Fehler in Facebook Connect (Javascript sdk)

<script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script> 
<div id="fb-root"></div> 
<script src="http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php" type="text/javascript"> </script> 
<script src="http://connect.facebook.net/en_US/all.js"></script> 
<script> 
    FB.init({ 
    appId : '12344', // my real app id is here 
    status : true, // check login status 
    cookie : true, // enable cookies to allow the server to access the session 
    xfbml : false // parse XFBML 
    }); 

    FB.login(function(response) { 
    if (response.session) { 
    if (response.perms) { 
     alert('user is logged in and granted some permissions'); 
     // user is logged in and granted some permissions. 
     // perms is a comma separated list of granted permissions 
    } else { 
     alert('user is logged in, but did not grant any permissions'); 
     // user is logged in, but did not grant any permissions 
    } 
    } else { 
     alert('user is not logged in'); 
    // user is not logged in 
    } 
}, {perms:'email'}); 
</script> 

Und ich habe eine Login-Button an einem anderen Ort (viel vor dem oben genannten Skripte) in der gleichen Seite wiedergegeben mit:

<fb:login-button v="2">Connect with Facebook</fb:login-button> 

Dieser Schaltfläche rendert als normale fb connect-Taste und klickt darauf, öffnet ein neues Popup-Fenster wie es normalerweise sollte. Problem ist, dass der Fehler 'ungültiger API-Schlüssel angegeben' angezeigt wird. Bei der Überprüfung der Adressleiste von Popup, sehe ich, dass api_key = undefined wird übergeben :(

Irgendeine Idee zu diesem Thema? Ich versuche, dies für die letzten 5 Stunden jetzt zu beheben ... Bitte helfen Sie mir herauszufinden, warum die richtige API Schlüssel ist nicht auf popup-Fenster übergeben wird.

Vielen Dank im Voraus.

Antwort

4

ich das gleiche tun, und ich fand ein Beispiel, das sehr einfach zu implementieren und verstehen (hier thay Verwendung jQuery, aber Sie kann dasselbe ohne Bibliotheken tun):

<body> 
    <div> 
    <button id="login">Login</button> 
    <button id="disconnect">Disconnect</button> 
    </div> 
    <div id="user-info" style="display: none;"></div> 

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 

    <div id="fb-root"></div> 
    <script src="http://connect.facebook.net/en_US/all.js"></script> 
    <script> 
    // initialize the library with the API key 
    FB.init({ appId : '12344' }); 

    // fetch the status on load 
    FB.getLoginStatus(handleSessionResponse); 

    $('#login').bind('click', function() { 
     FB.login(handleSessionResponse); 
    }); 

    $('#disconnect').bind('click', function() { 
     FB.api({ method: 'Auth.revokeAuthorization' }, function(response) { 
     clearDisplay(); 
     }); 
    }); 

    // no user, clear display 
    function clearDisplay() { 
     $('#user-info').hide('fast'); 
    } 

    // handle a session response from any of the auth related calls 
    function handleSessionResponse(response) { 
     // if we dont have a session, just hide the user info 
     if (!response.session) { 
     clearDisplay(); 
     return; 
     } 

     // if we have a session, query for the user's profile picture and name 
     FB.api(
     { 
      method: 'fql.query', 
      query: 'SELECT name, pic FROM profile WHERE id=' + FB.getSession().uid 
     }, 
     function(response) { 
      var user = response[0]; 
      $('#user-info').html('<img src="' + user.pic + '">' + user.name).show('fast'); 
     } 
    ); 
    } 
    </script> 
</body> 

Lo ok here für den gesamten Code und here können Sie andere Ressource finden.

+0

Danke für die Hilfe Kucdede. Ich konnte mein Projekt mit der alten FB.Connect-Klasse (ja, wirklich) loswerden. Wie ironisch ist das, dass die FB Dev-Dokumentation eine Mischung aus alten und neuen Codes enthält, ohne Hinweise darauf, welcher Version dieser Doku gehört ... Wirklich, das ist die schrecklichste Dokumentation, die ich jemals in meinem Leben gesehen habe. Ich schätze deine Hilfe jedoch. Vielleicht muss ich das verwenden, wenn ich in Zukunft auf ein ähnliches Projekt stoße. –

1

Sie müssen die Canvas-post-authorize-URL festlegen und sicherstellen, dass die Basis-Canvas-URL ein Präfix der post-authorize-URL ist.

3

Ich hatte meine facebook connect-Adresse auf www eingestellt und ich habe auf meine Test-Site mit nicht www zugegriffen, als ich auf die www-Version fb connect funktionierte, funktionierte gut.