I’m trying to keep track of user logins. I’m using a hook inside login.js, looking for when props.authState.accessToken changes, as it seemed that this was a point when I could reliably establish that the user was known and they hadn’t started to do anything.
I’m finding that about one time in twenty, the POST to server is failing (response is null). This is making me think that there is some network dependent timing issue.
Am I putting my call in at the right point in the login process, or is there some other point in the process I should be utilising?
login.js code:
export default withOktaAuth(function Login(props) {
useEffect(() => {
async function startNewUserSession() {
if (props.authState.accessToken) {
const info = await props.authService.getUser();
await storeUserSession(info, props.authState.accessToken);
}
}
startNewUserSession();
}, [props.authState.accessToken, props.authService]);
const handleSignIn = async (res) => {
if (res.status === "SUCCESS") {
return props.authService.redirect({
sessionToken: res.session.token
});
} else {
// The user can be in another authentication state that requires further action.
// For more information about these states, see:
// https://github.com/okta/okta-signin-widget#rendereloptions-success-error
console.log(`res status = ${res.Status}`);
return null;
}
}
const handleError = async (err) => {
console.log("error logging in", err);
}
return props.authState.accessToken ?
<div>Signing in... </div> :
<OktaSignInWidget
baseUrl={props.baseUrl}
onSuccess={handleSignIn}
onError={handleError} />;
});
async function storeUserSession(user, accessToken) {
const userName = encodeURIComponent(user.email);
const displayName = encodeURIComponent(user.name);
console.log(`userName ${userName} & displayName ${displayName}`);
const response = await fetch(`userSession?&userName=${userName}&displayName=${displayName}`,
{
method: "POST",
headers: {
Authorization: `Bearer ${accessToken}`
}
});
const data = await response.json();
const userSession = { id: data.id, date: Date.now() };
localStorage.setItem("userSession", JSON.stringify(userSession));
console.log(`userSession set to ${userSession.id}`);
};