How to properly wait (via Promise) on a JWT token? about aws-mobile-appsync-sdk-js HOT 10 CLOSED

Hi,

You can provide an async function that returns a promise containing the token. Here is how you would do it using the Auth module from Amplify:

const client = new AWSAppSyncClient(
  {
    url: process.env.APPSYNC_API_URL,
    region: process.env.AWS_REGION,
    auth: {
      type: AUTH_TYPE.AMAZON_COGNITO_USER_POOLS,
      jwtToken: async () => (await Auth.currentSession()).getIdToken().getJwtToken(),
    },
  },
  {
    defaultOptions: {
      watchQuery: {
        fetchPolicy: 'cache-and-network',
      },
    },
  }
);

Hope this helps :)

from aws-mobile-appsync-sdk-js.

I might suggest adding promise resolver function in case of error. This will prevent anything from being printed to the console.log.

 jwtToken: async () => (await Auth.currentSession()
        .then(data => {
          return data
        })
        .catch(err => {
          return err
        })).getIdToken().getJwtToken(),

from aws-mobile-appsync-sdk-js.

Hey @ffxsam

Ah yes.. right. I guess it makes no sense for me to fetch that from the Vuex store.

Right, things will be easier for you if you read the token using amplify

Here's the next issue: when Amplify refreshes the user's tokens, how will AppSync pick up on that?

For every single request, the AppSync client will await for the promise you return in

jwtToken: async () => (await Auth.currentSession()).getIdToken().getJwtToken()

That jwtToken function will be executed once per request and the token will be always fresh (Amplify internally handles the refresh for you)

from aws-mobile-appsync-sdk-js.

@cdcv You didn't have to dig too far to get the right answer:

https://aws-amplify.github.io/docs/js/api#cognito-user-pools-auth

import Amplify, { Auth } from 'aws-amplify';
import awsconfig from './aws-exports';

Amplify.configure(awsconfig);

const client = new AWSAppSyncClient({
  url: awsconfig.aws_appsync_graphqlEndpoint,
  region: awsconfig.aws_appsync_region,
  auth: {
    type: AUTH_TYPE.AMAZON_COGNITO_USER_POOLS,
    jwtToken: async () => (await Auth.currentSession()).getIdToken().getJwtToken(),
  },
});

It's documented. Their code is a bit different from yours, so I'd try that instead.

from aws-mobile-appsync-sdk-js.

Ah yes.. right. I guess it makes no sense for me to fetch that from the Vuex store.

Here's the next issue: when Amplify refreshes the user's tokens, how will AppSync pick up on that?

from aws-mobile-appsync-sdk-js.

@ffxsam #49 might be helpful

from aws-mobile-appsync-sdk-js.

I'm not sure how that helps. Amplify supposedly auto refreshes the tokens for you. How can I know when that happens? How do I update the JWT token in AppSync?

from aws-mobile-appsync-sdk-js.

Thanks, Manuel!

from aws-mobile-appsync-sdk-js.

After a LONG time trying to figure out where a random error that appeared and crashed our app was, I did this as per your suggestion (thanks @menkveldj):

const client = new AWSAppSyncClient({
url: aws_config.aws_appsync_graphqlEndpoint,
region: aws_config.aws_appsync_region,
auth: {
type: AUTH_TYPE.AMAZON_COGNITO_USER_POOLS,
// type: AUTH_TYPE.API_KEY,
// apiKey: aws_config.aws_appsync_apiKey
jwtToken: async () => (await Auth.currentSession()
.then(data => {
return data
})
.catch(err => {
console.log('AWS sux my arse because:',err);
return err
})).getIdToken().getJwtToken()
}
})

However, this doesn't fully solve the problem.
Now I'm getting:
bundle.js:20121 Uncaught (in promise) TypeError: (intermediate value).getIdToken is not a function. I'm not sure how to handing the error case correctly. Thank you for your help.

AWS: Please consider making your product actually work / documenting it adequately to be useable. Reading the many postings on this technology, it's clear that many people have spent many days (like we have) trying to get the very most basic of all functionality (authentication to be able to use it at all) to work using AppSync. We certainly wish that we had never used it at all.

from aws-mobile-appsync-sdk-js.

Yes @ffxsam that's the code that we started with, which caused all the problems, is directly out of their documentation, and does not work / causes the app to crash because it does not contain adequate error checking and it throws errors.

from aws-mobile-appsync-sdk-js.