Come utilizzare l'API grafico con react-native-fbsdk?

Question

Ho letto il documento, sia su github e Facebook developers docs.
C'è solo il campione, niente di più. Nessun documento API.

Il codice per effettuare una richiesta di Graph API è

const infoRequest = new GraphRequest(
    '/me', 
    null, 
    this._responseInfoCallback, 
); 

E la richiamata

_responseInfoCallback(error: ?Object, result: ?Object) { 
    if (error) { 
    alert('Error fetching data: ' + error.toString()); 
    } else { 
    alert('Success fetching data: ' + result.toString()); 
    } 
} 

e qui è la possibilità di eseguire una richiesta Graph API

testRequestGraphAPI(){ 
    const infoRequest = new GraphRequest(
    '/me', 
    null, 
    this._responseInfoCallback, 
); 
    new GraphRequestManager().addRequest(infoRequest).start(); 
} 

Tuttavia, Non riesco a trovare alcun altro documento. Non ho idea di cosa fanno tutti i parametri.

Il risultato per questi codici sopra è questo.

Inoltre, non so come ottenere il risultato.

Tuttavia, quando provo a modificare '\ me' in 'me? Fields = id, name', non è riuscito. Anche se ho chiesto il permesso

<LoginButton 
    publishPermissions={["publish_actions,user_birthday, user_religion_politics, user_relationships, user_relationship_details, user_hometown, user_location, user_likes, user_education_history, user_work_history, user_website, user_managed_groups, user_events, user_photos, user_videos, user_friends, user_about_me, user_status, user_games_activity, user_tagged_places, user_posts, user_actions.video, user_actions.news, user_actions.books, user_actions.music, user_actions.fitness, public_profile, basic_info"]} 
    onLoginFinished={ 
    (error, result) => { 
     if (error) { 
     alert("login has error: " + result.error); 
     } else if (result.isCancelled) { 
     alert("login is cancelled."); 
     } else { 
     AccessToken.getCurrentAccessToken().then(
      (data) => { 
      meow_accesstoken = data.accessToken 
      alert(meow_accesstoken.toString()) 
      } 
     ) 
     } 
    } 
    } 
    onLogoutFinished={() => alert("logout.")}/> 

Ma non stampare quale errore, proprio oggetto oggetto.

Quindi, il problema è che non capisco il codice di esempio fornito da Facebook senza alcuna spiegazione.

Qui è la mia domanda che ho davvero bisogno mi aiuti:
primo luogo a tutti, si prega di controllare il javascript code che ho attualmente guardando?
Come utilizzare grafico API in reagire-native-fbsdk per recuperare alcune utente informazioni (esempio: nome completo) e con successo visualizzazione esso (avviso uso)?
Che cosa fanno ciascun parametro in GraphRequest()?
Qual è la struttura di errore oggetto e risultato oggetto in _responseInfoCallback?

SOLUZIONE
Grazie a @Samuel risposta, ho aggiornato il mio codice

testRequestGraphAPI: function(){  
     const infoRequest = new GraphRequest(
      '/me', 
      { 
      parameters: { 
       fields: { 
       string: 'email,name,first_name,middle_name,last_name' // what you want to get 
       }, 
       access_token: { 
       string: meow_accesstoken.toString() // put your accessToken here 
       } 
      } 
      }, 
      this._responseInfoCallback // make sure you define _responseInfoCallback in same class 
     ); 
    new GraphRequestManager().addRequest(infoRequest).start(); 
    } 

E la richiamata

_responseInfoCallback: function(error: ?Object, result: ?Object) { 
    alert("meow response"); 
    if (error) { 
     alert('Error fetching data: ' + error.toString()); 
     console.log(Object.keys(error));// print all enumerable 
     console.log(error.errorMessage); // print error message 
     // error.toString() will not work correctly in this case 
     // so let use JSON.stringify() 
     meow_json = JSON.stringify(error); // error object => json 
     console.log(meow_json); // print JSON 
    } else { 
     alert('Success fetching data: ' + result.toString()); 
     console.log(Object.keys(result)); 
     meow_json = JSON.stringify(result); // result => JSON 
     console.log(meow_json); // print JSON 
    } 
    } 

* Nota: per console.log(), è necessario utilizzare "Debug JS in remoto", quindi aprire gli strumenti di sviluppo di Chrome per visualizzare il registro.

Answer 1

Sfortunatamente la documentazione react-native-fbsdk non è aggiornata e gli esempi non funzionano bene.

Ho avuto lo stesso problema e l'ho risolto per tentativi.

Per risolvere il problema è necessario modificare il GraphRequest aggiungendo params e campi ad esso come questo:

<LoginButton 
    onLoginFinished={ 
     (error, result) => { 
     if (error) { 
      alert("login has error: " + result.error); 
     } else if (result.isCancelled) { 
      alert("login is cancelled."); 
     } else { 

      AccessToken.getCurrentAccessToken().then(
      (data) => { 
       let accessToken = data.accessToken 
       alert(accessToken.toString()) 

       const responseInfoCallback = (error, result) => { 
       if (error) { 
        console.log(error) 
        alert('Error fetching data: ' + error.toString()); 
       } else { 
        console.log(result) 
        alert('Success fetching data: ' + result.toString()); 
       } 
       } 

       const infoRequest = new GraphRequest(
       '/me', 
       { 
        accessToken: accessToken, 
        parameters: { 
        fields: { 
         string: 'email,name,first_name,middle_name,last_name' 
        } 
        } 
       }, 
       responseInfoCallback 
      ); 

       // Start the graph request. 
       new GraphRequestManager().addRequest(infoRequest).start() 

      } 
     ) 

     } 
     } 
    } 
    onLogoutFinished={() => alert("logout.")}/> 

è necessario abilitare il Remote Debug JS per vedere le informazioni console.log(). https://facebook.github.io/react-native/docs/debugging.html

E probabilmente è necessario per ottenere alcune autorizzazioni per ottenere più informazioni di nomi e-mail in modo che sia una buona idea di guardare il Facebook Graph API Documentazione: https://developers.facebook.com/docs/graph-api/overview/

Riferimento:

https://github.com/facebook/react-native-fbsdk/issues/105#issuecomment-206501550

Answer 2

Ecco un esempio di pulsante personalizzato se si desidera crearne uno :)

FbLoginButton() { 
LoginManager 
    .logInWithReadPermissions(['public_profile']) 
    .then(function (result) { 
    if (result.isCancelled) { 
     alert('Login cancelled'); 
    } else { 
     AccessToken 
     .getCurrentAccessToken() 
     .then((data) => { 
      let accessToken = data.accessToken 
      alert(accessToken.toString()) 

      const responseInfoCallback = (error, result) => { 
      if (error) { 
       console.log(error) 
       alert('Error fetching data: ' + error.toString()); 
      } else { 
       console.log(result) 
       alert('Success fetching data: ' + result.toString()); 
      } 
      } 

      const infoRequest = new GraphRequest('/me', { 
      accessToken: accessToken, 
      parameters: { 
       fields: { 
       string: 'email,name,first_name,middle_name,last_name' 
       } 
      } 
      }, responseInfoCallback); 

      // Start the graph request. 
      new GraphRequestManager() 
      .addRequest(infoRequest) 
      .start() 

     }) 
    } 
    }, function (error) { 
    alert('Login fail with error: ' + error); 
    }); 
    }