html 响应数据 ID 不能在 Facebook API 调用中用作字符串

html response data id not able to be used as string in facebook API call

本文关键字：调用 字符串 API Facebook 数据 响应 ID 不能 html      更新时间：2023-09-26

我正在尝试使用facebook API来获取用户的照片。首先，我这样做，从Facebook获取一系列带照片的身份证件：

function getPhotos() {
    FB.api(
      "/me/photos?type=tagged",
      function (response) {
        if (response && !response.error) {
          console.log(response.data[0].id);
          displayPhotos(response.data[0].id);
        }
        else {
          console.log(response.error);
        }
      }
   );
}

上面的步骤工作正常，我在response.data对象中返回了一个图像 ID 数组。然后我想只拍摄第一张图片并将其发送到此处的另一个函数，以便我可以获取并显示第一张图片。

function displayPhotos(photoId) {
    FB.api(
      "/"+photoId,
      function (response) {
        if (response && !response.error) {
          console.log("display photos response" + response);
          var container = document.getElementById("photos");
          var img = new Image();
          img.src = response;
          container.appendChild(img);
        }
        else {
          console.log(response.error);
        }
      }
   );
}

但是，当 response.data[0].id 从一个函数传递到另一个函数时，它似乎从一个字符串变成了一个对象，这不适用于第二个 API 调用。当第二个函数尝试调用时，我在开发人员控制台中看到：

GET http://localhost/ropes/[object%20Object] 404 (Not Found)

我希望它说[object%20Object]的地方是第一个response.data[0]对象的字符串 id。

尝试显式设置：

var myId = response.data[0].id;
displayPhotos(myId);

您误解了错误消息和错误消息。它的原因在这里 – 它不是由访问response.data[0].id 引起的，该值很好。

它来自您尝试使用第二个 API 调用的响应来生成和请求图像的点，

var img = new Image();
img.src = response;

response在这里是一个对象，因此当您将其分配给img对象的 src 属性时，需要将其转换为字符串值。这会导致[Object object]，因此您的浏览器现在发出http://localhost/ropes/[object%20Object]请求，因为这是您指定为图像源的内容。

在这些行之前将response对象记录到控制台 – 检查它，查看它包含哪些属性，然后将相应属性的值分配给 img src 。

感谢您的回答，您帮助将我推向了正确的方向，此后我修改了我的代码以获取profile pictures相册并显示这些照片，为了解决问题，我必须做几件事： 1.） 将/picture添加到照片 ID 的末尾，以获得包含 URL 的响应。另外，我只是使用了以http://...开头的整个网址：

  function getAlbums() {
    FB.api(
      "/me/albums",
      function (response) {
        if (response && !response.error) {
          console.log(response);
          for (i = 0; i < response.data.length; i++) { 
            if(response.data[i].name == "Profile Pictures") {
              console.log(response.data[i].name);
              var myId = '/'+response.data[i].id;
              getPhotos(myId);
            }
            else {
              //
            }
          }
        }
        else {
          console.log(response.error);
        }
      }
    );
  }
  function getPhotos(albumId) {
    //alert(typeof photoId);
    FB.api(
      'http://graph.facebook.com'+albumId+'/photos',
      function (response) {
        if (response && !response.error) {
          console.log(response);
          for (i = 0; i < response.data.length; i++) { 
              var myId = '/'+response.data[i].id;
              displayPhotos(myId);
          }
        }
        else {
          console.log("This error?");
          console.log(response.error);
        }
      }
    );
  }
  function displayPhotos(photoId) {
    //alert(typeof photoId);
    FB.api(
      'http://graph.facebook.com'+photoId+'/picture?type=thumbnail',
      function (response) {
        if (response && !response.error) {
          console.log(response);
          var container = document.getElementById("photos");
          var img = new Image();
          img.src = response.data.url;
          container.appendChild(img);
        }
        else {
          console.log("This error?");
          console.log(response.error);
        }
      }
    );
  }
相关文章：