При входе через fb на сайт моя функция TestApi не собирает данные пользователя

Question

Я пытаюсь создать логин через фейсбук на сайте. К сожалению, пока пользователь вошел в систему и сработала функция TestAPI (), я не могу получить данные от пользователя.

 function TestAPI(){ 
   FB.api('/me?fields=id,name,email', function response (){
     if (response && !response.error){
       console.log(response); 
       buildProfile (response);
     }
   })
 } 

 function buildProfile(user){
   let profile = `
     <h3> $(user.name)</h3>
     <p> $(user.id) </h3>
     <p> $(user.email) </h3>`; 

   document.getElementById('profile').innerHTML = profile; 
 }

У меня есть следующие сообщения в консоли:

sdk.js:108 Uncaught TypeError: Cannot set property 'innerHTML' of 
null 
at buildProfile (volunteer_system.html:65)
at response (volunteer_system.html:50)
at a.__wrapper.a.__wrapper (sdk.js:108)
at D (sdk.js:123)
at Object.b.onload (sdk.js:119)
at sdk.js:119
at sdk.js:50
at XMLHttpRequest.c.onreadystatechange (sdk.js:119)

Answer 1

Я получаю функцию вместо данных

console.log(response);

Это распечатывает функцию вместо данных ответа, потому что response - это имя вашей функции, а не имя аргумента, переданного функции. Рассмотрим изменение ниже:

function TestAPI() { 
    FB.api('/me?fields=id,name,email', function(response) {
        if (response && !response.error) {
            console.log(response); 
            buildProfile (response);
        }
   });
}

TypeError: Невозможно установить свойство 'innerHTML' для null

Это означает, что document.getElementById('profile') возвращает ноль, возможно, что элемент с таким идентификатором не существует в вашей DOM, но это трудно подтвердить, если вы не предоставите фрагмент кода HTML, который вы пытаетесь изменить. У вас должен быть элемент, который выглядит примерно так:

<div id="profile"></div>