Expo auth hook is OAuth 2.0 authentication and authorization management library for expo app.
This probably going to work with many OAuth 2.0 services, but I only tested with auth0 service.
🚀 Don't have to eject your expo app because it use expo-auth-session
expo sdk libs.
👨🚀 Manage previous login session with refresh token.
npm install expo-auth-hook
# Or:
yarn add expo-auth-hook
It also needs other expo libraries
npm install expo-auth-session expo-secure-store expo-web-browser expo-random
# Or
yarn add expo-auth-session expo-secure-store expo-web-browser expo-random
Use your app auth configuration and apply it to AuthProvider
.
For redirectUri
when in development using Expo Go app, it will be your computer ip, exp://192.168.100.68:19000
, so make sure to add it in callback url and logout url config.
import { AuthProvider, useAuth } from 'expo-auth-hook';
export default function App() {
return (
<AuthProvider
clientId={Config.authClientId}
domain={Config.authDomain}
redirectUri={`${Constants.manifest?.scheme}://auth`}
audience={Config.authAudience}
>
<Route />
</AuthProvider>
);
}
export function Route() {
const {
isLoading,
isAuthenticated,
getAccessTokenSilently,
loginWithRedirect,
logout
} = useAuth();
if (isLoading) {
return <LoadingScreen />
}
return (
<NavigationContainer>
{isAuthenticated ? (
<Stack.Navigator >
<Stack.Screen name="Main App" component={MainApp} />
</Stack.Navigator>
) : (
<Stack.Navigator screenOptions={{headerShown: false}}>
<Stack.Screen name="Login" component={LoginScreen} />
</Stack.Navigator>
)}
</NavigationContainer>
)
}