Authenticate Apollo Client to AWS AppSync with Cognito User Pools

Question

I am trying to connect to my AWS AppSync API using the plain Apollo Client but I am not sure how to structure the authentication header correctly.

So far I have followed the header authentication documentation here: https://www.apollographql.com/docs/react/recipes/authentication.html

And have this code, which I adapted to include the token call to the Amplify authentication service but it returns a 401 error:

const httpLink = createHttpLink({
  uri: '[API end point address]/graphql'
});

const authLink = setContext((_, { headers }) => {
  const token = async () => (await Auth.currentSession()).getAccessToken().getJwtToken();
  return {
    headers: {
      ...headers,
      authorization: token ? `Bearer ${token}` : ""
    }
  }
})

const client = new ApolloClient({
  link: authLink.concat(httpLink),
  cache: new InMemoryCache()
})

The only documentation I can find relating to this doesn’t provide any technical instructions:

When using Amazon Cognito User Pools, you can create groups that users
belong to. This information is encoded in a JWT token that your
application sends to AWS AppSync in an authorization header when
sending GraphQL operations.

From here: https://docs.aws.amazon.com/appsync/latest/devguide/security.html

I know that token is fine because if I use the AppSync JavaScript API then it works. Is there anywhere I can go to find out how to achieve this or does someone know how?

Edit:

So far i have tried changing this line:

  authorization: token ? `Bearer ${token}` : ""

The following attempts:

token

jwtToken: token

authorization: token

Authorization: token

None of these have worked either.

cyberwombat 38.2k35 gold badges175 silver badges253 bronze badges · Accepted Answer · 2020-02-25 21:19:35Z

5

Disclaimer: Never tried it, but here is what I would do:

Check out the AppSync Client code here as a foundation for creating a an Authentication link for Apollo Client and the AppSync server. It looks like that code provides the scaffolding for each of the available authentication methods.

Specifically, if you are trying to use the OPENID_CONNECT method of authentication, it appears as if the JWT token does not need to be prepended by Bearer (line 156).

edited Feb 25, 2020 at 21:19

cyberwombat

38.2k35 gold badges175 silver badges253 bronze badges

answered Sep 7, 2018 at 17:10

Jclangst

1,2748 silver badges11 bronze badges

5

That makes sense, but annoyingly the case for Cognito user pools is blank. Editing question to show things tried so far.

– Exitialis

Sep 7, 2018 at 17:48
Based on what I read from the AppSync developer guide, the Cognito User Pool Auth should use the OPENID_CONNECT method using the JWT token provided by the Cognito User Pool service.

– Jclangst

Sep 7, 2018 at 17:53
Also, this is specified on line 144 of the link I posted.

– Jclangst

Sep 7, 2018 at 17:55
The Authorization: token format should be the key to getting it to work, so I think the issue is likely with your Cognito User Pool config or the token itself rather than with the Apollo setup.

– Jclangst

Sep 7, 2018 at 18:01
Sorry, you are correct, I saw that line but did not realise that you nothing in the case meant that it does what the following case does.

– Exitialis

Sep 8, 2018 at 19:47

score 4 · Accepted Answer · 2019-02-26 20:59:31Z

You can see an example of it on Github from AWS sample.
Works with AppSync but very similar.

// AppSync client instantiation
const client = new AWSAppSyncClient({
  url: GRAPHQL_API_ENDPOINT_URL,
  region: GRAPHQL_API_REGION,
  auth: {
    type: AUTH_TYPE,
    // Get the currently logged in users credential.
    jwtToken: async () => (await Auth.currentSession()).getAccessToken().getJwtToken(),
  },
  // Amplify uses Amazon IAM to authorize calls to Amazon S3. This provides the relevant IAM credentials.
  complexObjectsCredentials: () => Auth.currentCredentials()
});

Link to the AWS repo

rMilirMili 987 bronze badges · Accepted Answer · 2023-09-29 06:28:46Z

-3

Have a look at this working script here and remember to replace the values value https://github.com/razorRun/appsync-cognito-apollo-amplify-test

answered 18 mins ago

rMili

987 bronze badges

1

A link to a solution is welcome, but please ensure your answer is useful without it: add context around the link so your fellow users will have some idea what it is and why it is there, then quote the most relevant part of the page you are linking to in case the target page is unavailable. Answers that are little more than a link may be deleted.

– Adriaan

16 mins ago

Authenticate Apollo Client to AWS AppSync with Cognito User Pools