Integrating JWT and Refresh Token Authentication

[darezzed]

I am working on a Flutter project using the Nylo framework and am currently implementing user authentication. My backend API uses JWT for access tokens and also provides refresh tokens for maintaining user sessions. I would like to know the best practices for integrating both JWT and refresh token mechanisms within the Nylo framework.

1. How can I securely store and manage JWT access tokens and refresh tokens in a Nylo-based Flutter app?
2. Is there a recommended approach or existing functionality in Nylo to automatically refresh the JWT access token using the refresh token when it expires?
3. Should I follow any specific considerations or best practices when handling token refresh logic in Nylo?

Any guidance, code snippets, or references to relevant documentation would be greatly appreciated.

[agordn52]

Hi @darezzed,

Sorry for the late reply on this!

If this were a requirement in one of my Nylo projects, I would first:

Create a method that would refresh the token, e.g. send an API request and then replace the existing token in local storage.

refreshToken() async {
   dynamic newTokenResponse = await api<MyApiService>((request) => request.newToken());
  // Save the token
  await NyStorage.store('user_token', newTokenResponse.token);
}

Then, create an Interceptor for Dio API requests - this will be used to add your auth token to each request and refresh the token.
In Nylo you can use dart run nylo_framework:main create:interceptor refresh_token

Lastly, you'll need to implement a way to check when the token is expired in the Interceptor and refresh when it's appropriate.

In the next version of Nylo, I'll attempt to build a custom class that extends the base Interceptor class that can handle this, it could help a lot of people.

[darezzed]

Thank you,

It's how I see it, too. Except that I store tokens within the user model.

[agordn52]

@darezzed,

In the latest version, I've added three new methods that you can override to make life easier for auth tokens.

The first is for setting authentication headers.

/* Authentication Headers
|--------------------------------------------------------------------------
| Set your auth headers
| Authenticate your API requests using a bearer token or any other method
|--------------------------------------------------------------------------
*/

Future<RequestHeaders> setAuthHeaders(RequestHeaders headers) async {
    String? myAuthToken = await StorageKey.userToken.read();
    if (myAuthToken != null) {
      headers.addBearerToken( myAuthToken );
    }
    return headers;
}

The second is for checking when you should refresh your token. E.g. if the expiry time is past DateTime.now()

/* Should Refresh Token
|--------------------------------------------------------------------------
| Check if your Token should be refreshed
| Set `false` if your API does not require a token refresh
|--------------------------------------------------------------------------
*/

@override
Future<bool> shouldRefreshToken() async {
    return false;
}

The last one is for implementing how you want the app to refresh the token

/* Refresh Token
|--------------------------------------------------------------------------
| If `shouldRefreshToken` returns true then this method
| will be called to refresh your token. Save your new token to
| local storage and then use the value in `setAuthHeaders`.
|--------------------------------------------------------------------------
*/

@override
refreshToken(Dio dio) async {
   dynamic response = (await dio.get("https://example.com/refresh-token")).data();
   Save the new token
    await StorageKey.userToken.store(response['token']);
}

You can override these methods in your API Service and behind the scenes it'll take care of everything 🚀