javascript - 如何获取str变量的值？

Question

我正在尝试使用 FB API 获取 URL(str 变量)。

当我尝试 CONSOLE2 console.log(str) 时，它显示了 str 变量的确切值，其中包含照片的 URL。

但是当我尝试CONSOLE1时，它不起作用。它什么也没打印。

是因为一些异步函数吗？如果是，如何编写下面两个语句(参见注释1)工作的代码(一个接一个执行并不重要，我只想要CONSOLE1中的URL我调用了 getPhoto())

注 1:这两个语句都表示 location.href 和 CONSOLE1，以确保我在 Login() 函数中获取 str 的值。

  function Login()
  {         
    FB.login(function(response) {
       if (response.authResponse) 
       {
          getPhoto();
         // window.location.href="quiz.html";
          //**CONSOLE1** 
          console.log(str);
         } else 
        {
           console.log('User cancelled login or did not fully authorize.');
        }
     },{scope: 'email,user_photos,user_videos,publish_actions'});
  }

  function getPhoto()
  {
    FB.api('/me/picture?type=normal', function(response) {
      var str="<br/><b>Pic</b> : <img src='"+response.data.url+"'/>";
        document.getElementById("status").innerHTML+=str;
         //**CONSOLE2**
         console.log(str);     
    });
  }

Answer 1

这个怎么样:

function Login() {       
    FB.login((response) => {
        if (response.authResponse) {
            getPhoto((str) => {
                console.log(str);
            });
        } else {
            console.log('User cancelled login or did not fully authorize.');
        }
    },{scope: 'email,user_photos,user_videos,publish_actions'});
}

function getPhoto(callback) {
    FB.api('/me/picture?type=normal', (response) => {
        const str = '<br/><b>Pic</b> : <img src="' + response.data.url + '"/>';
        document.getElementById('status').innerHTML += str;
        callback(str);     
    });
}

还有其他解决方案(例如，使用 Promises)，但使用回调函数非常简单。我还添加了 ES6 语法(const、箭头函数)。

您还可以使用 FB.getLoginStatus 来检查用户是否在页面加载时登录，并在该函数的回调中调用 getPhoto 。

例如:http://www.devils-heaven.com/facebook-javascript-sdk-login/