Search code examples
reactjsaws-amplifycredentials

React AWS Ampify Auth fetchAuthSession returning undefined credentials

I have a React App that interfaces with AWS using the javascript v3 sdk. I'm also using "aws-amplify": "^6.0.6" for authentication. I've set up amplify and it's working great, but the problem is that I can't seem to get the credentials from Amplify/Auth to pass into other AWS resources like DynamoDB using:

const ddb = new DynamoDBClient({
    region: import.meta.env.VITE_AWS_REGION,
    credentials, // THIS IS WHAT I NEED
});

So far I have a higher order component wrapping my whole app:

import { withAuthenticator } from '@aws-amplify/ui-react';
...
export default withAuthenticator(APP);

according to https://docs.amplify.aws/react/build-a-backend/auth/auth-migration-guide/#authcurrentusercredentials-deprecated I should be able to get the credentials from using const session = await fetchAuthSession();

But my credentials are undefined...

my session looks like this:

{
    "credentials": undefined,
    "identityId": undefined,
    "tokens": {
        "accessToken": {
            "payload": {
                "sub": "xxxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
                "iss": "https://cognito-idp.us-east-1.amazonaws.com/us-east-1_xxxxxxxxx",
                "client_id": "xxxxxxxxxxxxxxxxxxxxx",
                "origin_jti": "xxxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
                "event_id": "xxxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
                "token_use": "access",
                "scope": "aws.cognito.signin.user.role",
                "auth_time": 1702010502,
                "exp": 1702014102,
                "iat": 1702010502,
                "jti": "xxxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
                "username": "xxxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"
            }
        },
        "idToken": {
            "payload": {
                "sub": "xxxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
                "email_verified": true,
                "iss": "https://cognito-idp.us-east-1.amazonaws.com/us-east-1_xxxxxxxxx",
                "cognito:username": "xxxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
                "origin_jti": "xxxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
                "aud": "xxxxxxxxxxxxxxxxxxxxxx",
                "event_id": "xxxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
                "token_use": "id",
                "auth_time": 1702010502,
                "exp": 1702014102,
                "iat": 1702010502,
                "jti": "xxxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx",
                "email": "xxxxx@email.com"
            }
        },
        "signInDetails": {
            "loginId": "xxxxx@email.com",
            "authFlowType": "USER_SRP_AUTH"
        }
    },
    "userSub": "xxxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx"
}

Is there something else I need to do to get the credentials object?

Solution

  • Are you using Cognito Identity Pools? If not, you should use them in order to get credentials.

    This is how you can configure it in React app for existing Cognito resources. You have to set identityPoolId here.

    // REQUIRED only for Federated Authentication - Amazon Cognito Identity Pool ID
identityPoolId: 'XX-XXXX-X:XXXXXXXX-XXXX-1234-abcd-1234567890ab'

    enter image description here

    Refer Set up and configure Amplify Auth - Existing Resources tab for more detail.