CODEWITHSUNDEEP
imagereact-nativefacebook-graph-api
Bill Pope
Bill Pope

Reputation: 591

facebook graph api images GraphRequest

I'm attempting to get the profile image of the user after logging in using FB graph. I'm getting a URL but no image

code:

async fetchProfile(callback) {

  return new Promise((resolve, reject) => {
    const request = new GraphRequest(
      '/me',
      {
        parameters: { fields: { string: 'picture.width(480),name' } }
      },
      (error, result) => {
        if (result) {
          const profile = result
          profile.avatar = `https://graph.facebook.com/${result.id}/picture`;
          resolve(profile)
        } else {
          reject(error)
        }
      }
    )

    this.requestManager.addRequest(request).start()
  })
}
}

response:

{
  "avatar": "https://graph.facebook.com/4567877885493457976/picture",
    "id": "4567877885493457976",
      "name": "Billy Pope",
        "picture": {
    "data": {
      "height": 389,
        "is_silhouette": false,
          "url": "https://platform-lookaside.fbsbx.com/platform/profilepic/?asid=10219826402184549&width=480&ext=1588823752&hash=AeTZXPsxkrdi79ep",
            "width": 480
    }
  }
}

How do I extract the image from either of these urls - avatar or url? Thanks

Upvotes: 1

Views: 96

Answers (1)

Bill Pope
Bill Pope

Reputation: 591

To display the image, I changed the view to look like:

{this.state.picture ? (
   <Image
       source={{ uri: this.state.picture }}
       style={styles.imageStyle}
   />
) : null}

adding a condition along with height and width and the image suddenly appeared.

Upvotes: 1

Related Questions