Hey all,
I have a basic React app where oktaAuth
(from the useOktaAuth
hook) is not showing expected values after a successful login.
The app structure is as follows:
// App.tsx
const oktaAuth = new OktaAuth({
issuer: `https://dev-xxx.okta.com/oauth2/default`, // hidden for privacy
clientId: 'xxx', // hidden for privacy
redirectUri: `${window.location.origin}/dashboard`,
})
function App() {
const onAuthRequired = function() {
history.push('/signin')
}
return (
<Security oktaAuth={oktaAuth} onAuthRequired={onAuthRequired} >
<Route path={SIGNIN}>
<SignIn />
</Route>
<Route path={DASHBOARD}>
<Dashboard />
</Route>
</Security>
)
}
// SignIn.tsx
function SignIn() {
const { oktaAuth } = useOktaAuth();
const [username, setUsername] = useState<string | undefined>('');
const [password, setPassword] = useState<string | undefined>('');
const handleSubmit = (e:{[key:string]:any}) => {
e.preventDefault();
if (!username || !password) return;
oktaAuth.signInWithCredentials({ username, password })
.then((res) => {
const { sessionToken } = res;
if (res.status === 'SUCCESS') {
oktaAuth.session.setCookieAndRedirect(sessionToken, `${window.location.origin}/dashboard`);
}
})
.catch((err) => console.log('Found an error', err));
};
return (
<div className={classes.page}>
<FormBox title="Sign In" onSubmit={handleSubmit}>
...
</FormBox>
</div>
);
}
on Dashboard.tsx
after successful login and redirect, we log oktaAuth
as follows:
const { authState, oktaAuth } = useOktaAuth();
console.log( authState)
however the values are
{isPending: true, isAuthenticated: false, idToken: null, accessToken: null, refreshToken: null}accessToken: nullidToken: nullisAuthenticated: falseisPending: truerefreshToken: null__proto__: Object
{accessToken: undefined, idToken: undefined, refreshToken: undefined, isPending: false, isAuthenticated: false}accessToken: undefinedidToken: undefinedisAuthenticated: falseisPending: falserefreshToken: undefined__proto__: Object
I can see that there are no cookies set locally, however they are set on https://dev-xxx.okta.com/oauth2/default.
Is something wrong with my approach?
Thank you