Question

我试图使用FB API获取URL（str变量）。

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

但是当我尝试 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/

Answer 2

在CONSOLE2块中，您明确定义变量str：

var str=...

但是在CONSOLE1块中，你从未真正定义变量。当函数 getPhoto 终止时，变量 str 超出范围且不再存在。

要解决此问题，请将您的逻辑放在 FB.api 调用的回调函数中。您可以将该调用放在FB.login回调函数中，而不是放在它自己的函数中。像这样：

FB.login(function(response) {
  if (response.authResponse) {
    FB.api('/me/picture?type=normal', function(response) {
...

在javascript中，您必须链接或嵌套回调。你必须等待登录回调，然后进行下一次API调用，然后进行你的获取图片回调等。

Answer 3

str var的范围保留在getPhoto函数中。要在CONSOLE1中获取值，您需要从getPhoto函数返回str的值。

希望这会对你有所帮助。

如何获取str变量的值？

3 个答案: