Get an URL to facebook user’s profile pic

  facebook-graph-api, fetch, html, javascript

I am using facebook’s graph api to get basic info about a user.
While sending a request to /me?fields=id,name,picture, I get the following response

{
  "id": "645636655991071",
  "name": "Rahul Dahal",
  "picture": {
    "data": {
      "height": 50,
      "is_silhouette": false,
      "url": "https://platform-lookaside.fbsbx.com/platform/profilepic/?asid=645636655991071&height=50&width=50&ext=1619960875&hash=AeSav5aZhqO_ExOLOPc",
      "width": 50
    }
  }
}

The url property of the picture object has the URL to the picture, but putting it in <img src=""> cannot load the image.

Furthermore, if I type that URL into address bar and hit enter, it prompts me to download the image.

What can I do to render that data into the DOM via <img src=""> ?

Source: Ask Javascript Questions

LEAVE A COMMENT