How to use Auth0 with Amplify react web app?


Hello, I am working on a react app using Amplify where I want to use Auth0 to authenticate users and grant access to Amplify resources such as a graphql API (AppSync).

The Auth0 quick start ( got me to the point of adding login, logout, and user profile to the app, BUT this doesn't help me integrate with Amplify. Through the AppSync console, I set my AppSync default authorization mode to OpenID Connect and then set the provider to my Auth0 domain / issuer URL. Then when my graphql schema uses the @aws_oidc and @auth(rules: [{ allow: private, provider: oidc }]) rules and can successfully run queries through the console with an auth token pasted in.

But how can I call API.graphql with that auth token? The following is not working, with error Error: No current user. Seems like I should be using amplify's Auth in here instead.

      const { user, isLoading, getAccessTokenSilently } = useAuth0();
      const token = await getAccessTokenSilently();
      const response = await API.graphql<GraphQLQuery<MyMutation>>({
        query: updateCredit,
        variables: { input: credit },
        authToken: token,
  • Update:

I've made some progress but gotten stuck yet again. This medium article was great at explaining how the flow should work:

And a doc explaining how to set up an identity pool with role that has the right trust policy:

However nothing I've tried resolves this error: InvalidIdentityPoolConfigurationException: Invalid identity pool configuration. Check assigned IAM roles for this pool.

I have checked this trust relationship for the role many times:

    "Version": "2012-10-17",
    "Statement": [
            "Effect": "Allow",
            "Principal": {
                "Federated": ""
            "Action": "sts:AssumeRoleWithWebIdentity",
            "Condition": {
                "StringEquals": {
                    "": "us-east-1:xxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"
                "ForAnyValue:StringLike": {
                    "": "authenticated"
1 Answer
Accepted Answer

Well, it turns out I was close and in my Cognito identity pool I could see the identity created when signing in with Auth0 and then passing the ID token with Amplify's Credentials.set method:

import { useAuth0 } from '@auth0/auth0-react';
import { Auth } from 'aws-amplify';
import { Credentials } from '@aws-amplify/core';

const { isAuthenticated, loginWithRedirect, getIdTokenClaims } = useAuth0();
const config = getConfig();
useEffect(() => {
    const fetchAccessToken = async () => {
      const idtoken = await getIdTokenClaims();
      await Credentials.set(
          provider: config.domain,
          token: idtoken.__raw,
          user: { name: },
          expires_at: idtoken.exp,

      const currentUser = await Auth.currentAuthenticatedUser();
      console.log('currentUser: ', currentUser);
    if (isAuthenticated) {
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [isAuthenticated]);

For some reason when setting up the Auth0 provider for my Cognito identity pool, I had chosen to use default mappings in the 'Attributes for access control' section. After changing this setting to Inactive, the InvalidIdentityPoolConfigurationException goes away!

answered 8 months ago
profile picture
reviewed a month ago
  • Still be careful in using id token as authentication mechanism

You are not logged in. Log in to post an answer.

A good answer clearly answers the question and provides constructive feedback and encourages professional growth in the question asker.

Guidelines for Answering Questions