It is okay to lift your state up this way. You donât have to rely on Redux for this. Redux can be quite useful but might not be a great choice when you are first starting out. This article can help you decide if you want to use Redux.
I havenât been able to get the session loading working properly. I have no clue whatâs wrong. I have gone to the point where I literally copy and pasted the file from github and it still does not save my session upon refresh.
I confirmed that isAuthenticated is changing to false after the refresh.
Any ideas? the only page that was edited in this chapter is App.js and I literally have that copied off of the github page for this project
The âisAuthenticatedâ variable is true but nothing is saved to local storage
What is not working for the session loading? It doesnât log the user out or doesnât keep them logged in?
It logs the user out upon refresh
Figured it out. I had gone back and manually created a user in the console. This meant that my user was still on status FORCE_CHANGE_PASSWORD. That was the problem
I see. Glad you figured it out.
Thanks for clearing this. I ran into the same issue.
This is quite a weird case as the account seems to be in limbo - it can be signed in without errors, but is unusable (at least in this Lessons context).
Hi, I have a question regarding Auth.currentSession(). It always returns a state of ârejectedâ with the reason being âNo userPoolâ.
I have checked both of my Cognito User Pool and my Identity Pool. The admin@example.com user has an Account Status of âEnabled / CONFIRMEDâ and the Identity Pool has been properly configured.
I also tried testing Invoking the API Gateway using the IAM Policy Simulator and when I ran the simulation, I got âallowedâ as the result so it seems that it should be fine. But when I tried actually testing it out on the browser, I always get the âno userPoolâ error upon the component mounting.
I was wondering if you guys have encountered this problem before or know of a way to fix it?
Just an update to the situation. I seemed to have found out the reason why it wasnât working. I did not configure Amplify before rendering App.
I mistakenly added Amplify.configure() below ReactDOM.render() in the index.js file. After moving Amplify.configure() above ReactDOM.render(), the âNo userPoolâ error went away.
Oh good catch. Glad you figured it out.
While I understand what the conditional expression is supposed to accomplish here, I am confused about the actual implementation. The docs state isAuthenticating
itâs there because âloading the user session is an asynchronous processâ but weâre using await
before Auth.currentSession()
and then setting state.isAuthenticated
to true
via userHasAuthenticated(true)
so shouldnât the user session be guaranteed to have already loaded by the time isAuthenticating is set to false? I also see that userHasAuthenticated()
calls setState()
which we canât be sure will run right away due to batching, but I donât see anything else that triggers another render()
prior to that specific setState()
being set�
Separate but related, the only time state.isAuthenticating = true
is right after the App is constructed. Assuming someone explains what I am missing above, shouldnât we set this back to true
at some point when the user logs out in preparation for another async user session call?
Just thought Iâd chime in here to say I had the same issue, which I fixed by changing my userâs password.
AWS wouldnât let me do it via the console, so I ended up working out how to do it via the CLI.
For anyone else who wants to do this, hereâs the command to run:
aws cognito-idp admin-set-user-password --user-pool-id [User pool ID] --username [Username] --password [New password] --permanent
I have a problem, so far in the App.js the this.state.isAuthenticated
is returning `true and is working as expected.
However, the childProps
object sent to the Routes doesnât seem to be updated because when I call this.props.isAuthenticated
from the New.js or List.js file the value is false
. Can you guys help me?
Hmm I think you might be a little confused about what the isAuthenticating
and isAuthenticated
flags are doing here. Iâm not entirely sure what the concern here is but let me expand on what is being done.
The entire session is managed not by our app code but by the Cognito SDK. We need to use some React state to handle the checking process.
- When our app first loads, we donât know if the user is logged in or not.
- So we want to hold off rendering the app. Thatâs the purpose of
isAuthenticating
. And itâs the reason why we donât need to reset it after the user logs out. - To check if the user is logged in we need to run
await Auth.currentSession()
. Once that check is done we setisAuthenticated
is they are and setisAuthenticating
to false to render our app.
Thatâs really strange. Have you compared your code to the one in the repo?
Thanks Jay, this was really helpful! Just today I noticed a page that was rendering with no data and then refreshing with data immediately after. FWIW, it was a Lambda that called another AWS resource.
Hmm what do you mean refreshing immediately after? Do you mean it was loading after a delay?
Thanks Jay, when I sent that message I had a good understanding of Reactâs downward rendering flow but I wasnât thinking about Routes (using react-router) as âscreensâ. I was also experimenting with async methods and I had removed the isAuthenticating code (from my prior message). The combination of those led to a Route being rendered before the async data was returned and what I referred to as a ârefreshingâ. I donât believe the whole DOM ever refreshed, just the part in the Route componentâŚ
I see. So whats the issue you are having now?