I'm building a React Native app with Expo SDK 49 (Bare workflow) using the keycloak configuration provided by Expo Auth. However, when I hit the Login button, I'm receiving invalid_parameter: redirect_uri
.
This is my Login page:
import * as React from 'react'
import * as WebBrowser from 'expo-web-browser'
import { makeRedirectUri, useAuthRequest, useAutoDiscovery } from 'expo-auth-session'
import { Button, Text, View } from 'react-native'
WebBrowser.maybeCompleteAuthSession()
export default function App() {
const discovery = useAutoDiscovery('http://localhost:8080/auth/realms/todo-app')
// Create and load an auth request
const [request, result, promptAsync] = useAuthRequest(
{
clientId: 'react-native-client',
redirectUri: makeRedirectUri({
scheme: 'poc-expo-router',
path: '/home',
}),
scopes: ['openid', 'profile'],
},
discovery
)
const handleOnPress = async () => {
const result = await promptAsync()
console.log('handler result: ', result)
return result
}
console.log('results: ', JSON.stringify(result, null, 2))
return (
<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
<Button title="Login!" disabled={!request} onPress={handleOnPress} />
{result && <Text>{JSON.stringify(result, null, 2)}</Text>}
</View>
)
}
I setup my keycloak realm locally using docker. Another question, since I'm using react native, I don't know what client id url I must use, since I'm not running my app on the browser using a normal url, I'm running from iOS simulator.