[FIXED] How to config Cognito to get Facebook Login to pass back picture url included?

Issue

Recently I had configure to use amplify with @aws-amplify/ui-react library to login Federated users.

Once login, for google user, I would get payload like

{
  "id": "",
  "email": "",
  "name": "",
  "picture": "",
  "token": ""
}

Yet for facebbook user, I get similar stuff but no picture info

{
  "id": "",
  "email": "",
  "name": "",
  "token": ""
}

I had tried to update config in my Cognito for Facebook provider. However, this failed to get picture info for me.

Is it possible to make amplify's federated login through Facebook to pass me back picture info as well? I know I could just call another Facebook api to retrieve picture, but I wish this could be avoided, since Google login would return picture info automatically.

P.S. Here's my Facebook identity providers config:

PPS. Here's my recent Cognito attribute mapping config:

For Facebook: and in CognitoUserSession's idToken's payload: the picture field would include a JSON object about profile picture's information

For Google, much simpler: and the payload: the picture field is simply the image link

Solution

Assuming you're requesting public_profile, use "picture" from Facebook Attribute is actually correct, I do face similar problems that I couldn't receive it until i delete the userpool, and creating a new one.

The value you will get from picture should be something like this

{
    "data": {
        "height": 50,
        "is_silhouette": false,
        "url": "https://platform-lookaside.fbsbx.com/platform/profilepic/?etcetcetcetc",
        "width": 50
    }
}

Answered By - xion

Answer Checked By - Mildred Charles (PHPFixing Admin)