1

LlI found this YouTube vid which provides a good intro to JWT auth tokens and refresh tokens:

https://youtu.be/mbsmsi7l3r4

Now I'm trying to integrate this design with a React app. I can store the JWT in my app Context and then pass it to API endpoints. Each endpoint would include an authenticate hook to validate authentication with the provided token.

  1. I'm thinking that the authenticate hook could generate and return a refresh token if the original authentication token is within 10 seconds of expiration

  2. But with this ^^^ approach, it seems like I would need to possibly return the auth token or refresh token as part of the API endpoint response object so my React app would have the ability to easily get a handle to that refresh token and pass it in to the next API endpoint call

So I'm just trying to postulate a possible design for JWT integration between my React app and Express API. How common is the approach that I described? Is there a better or more elegant way to do this?

random512
  • 1,017
  • 3
  • 13
  • 19

1 Answers1

1

When your access token expired, refresh token is used to get a new copy of access token. Both needs to be persisted somehow on client side. You may find useful information here from Auth0.

Note that refresh token can be implemented in a few form. Refer to this SO question.

My JWT workflow is something along these lines:

  1. Get refresh token and access token from Authorization Server
  2. Use access token to access resources from Resource Server
  3. Access token expired, Resource Server refused access and returned an something like unauthorized status
  4. App notified of expired access token, proceed to use refresh token to get new access token from Authorization Server
  5. Repeat

Your Auth server and Resource server may be the same.

Read this from Auth0 thoroughly.

David
  • 312
  • 3
  • 10