I'm currently working on a React Native app and using expo-auth-session for authentication.
The flow is as follows: I authenticate via a Google popup and successfully retrieve both the access token and refresh token, which I then store. The access token is functional, but only for an hour. After this duration, when I refresh the page, the app fails to reauthenticate.
Could anyone advise on the best practice for refreshing the access token in this context? I'm unsure how to proceed without compromising security by exposing sensitive information on the client side.
Login example and how i get the refresh and access tokens:
import * as Google from 'expo-auth-session/providers/google';
const [googleRequest, googleResponse, googlePromptAsync] = Google.useIdTokenAuthRequest({
//web
clientId: '<key>',
iosClientId: '<key>',
expoClientId: '<key>'
});
useEffect(() => {
if (googleResponse && googleResponse.type === 'success') {
handleGoogleLogin(googleResponse.authentication.accessToken)
const expiresIn = googleResponse.authentication.expiresIn;
storeUserTokenInKeychain({
accessToken: googleResponse.authentication.accessToken,
refreshToken: googleResponse.authentication.refreshToken,
expirationTime: getExpirationTime(expiresIn),
});
}
}, [googleResponse]);
I attempted to request a new access token from Google, but their documentation suggests that this approach is not advisable for React Native apps. It requires a client_secret and other fields that should not be exposed on the client side.