Awesome tutorial! This is exactly what I am looking for after being very frustrated with gems such as devise, will be watching more videos from you! Thank you!
Thank you for this tutorial, it has been very helpful. (Solution to a problem I faced ahead): I ran into a problem where I managed to login my user, but when I tried to GET the logged_in value, it was always False. The json view of the localhost:3001/logged_in was also false no matter if the user I tried to log in was valid or not Thought it might have something to do with the API only flag in my rails application, and although that might have contributed to the problem, it still persisted after reverting to ::Base. So my solution was to head to chrome://flags > SameSite cookies > Disabled, and it worked. For some reason my chrome was disabling my cross-site cookies from being sent on my heroku local. Hope it helps anyone that comes across this problem.
Thank you for the quick tutorial, really helpful! Please also note that you have a small typo at 6:23 , I think you wanted to use a logical AND instead of a bitwise one?
When I deployed the application to Heroku the back end and the front end to netlify the session is created by the logged_in method always says the user is null, why is that? if I am working with localhost it works fine the session is created the logged_in checks the user session and displays the correct info but I am on production the logged_in value keeps on giving me back user null, why is this happening? is the only step left I need to finish the project can you please point me in the right direction
Thanks for the tutorial! In addition, I would like to seek advice on approaching the situation when the user refreshes the page, will the state be persisted? or the user will have to re-login. Is there any way that I could persist the user login state when the page refreshes? Thanks. I know local storage is one way of persisting but the user can manually enter the value and login to the dashboard. Thanks once again.
Bu i can modify response and make it to be true. How we can protect users to modify our state, cookies, localStorage and where to store loggedIn variable to ask our script is user is logged or not?
great video, quick question how can i use the user email to display it below the status? I know that inside the handleSucessAuth i can do a console log to get the users email information like this console.log(data.user.email) and I will get the user email how can I use this to display it below the status when the user is logged in ?
Whenever I refresh the page, the page will show that the user is not logged in for a fraction of a second before changing to logged in. I know this is due to the "logged out" state being the default state of the component and that it rerenders to logged in after doing all the authentication stuff. My question is how do you avoid this and persist the logged in state so that it doesn't visibly rerender upon refreshing? I've seen some websites do this and I want to learn how they do it.
You can create a 'loading' state and not render anything on the page until the API call is complete and then change the loading state, that's the standard approach.
hello, i have problem with something, so in response i have only loggen_in:false dont know what is problem and i dont have user from api call Probably i have problem with :session because if session sent me false
Hey, great video; however, what if my site is client side (only loads the page when I search it)... aka, component will only mount once. So if I search my sites URL the check will occur, but if I open a second tab and search it, that will also pass because I'm logged in. So, now I have two tabs open for my site and I'm logged in, but if I log out of one, because it's client side, the page won't reload... so the other tab will still operate as if I'm logged in. How do you fix that? Hopefully that makes sense, if you need me to reword please let me know.
For something like that you could integrate a websocket that listens for events, such as a logout event and then when it occurs, the React app could trigger the redirect.
@@edutechional Thank you for your response, I have one more question about a request regarding "fetch", I know you use axios. I know you're probably too busy to check this out (I understand), but I've been stalled on this problem for 2 days now and am not making any progress. Any help would be greatly appreciated!! Here's the stack overflow question: stackoverflow.com/questions/63351799/react-fetch-credentials-include-breaks-my-entire-request-and-i-get-an-error
Hi there, I follow until this and cannot perform check if user is logged in. Seems like the previous requests didn't store cookies on my browser. Where should I start the investigation? Everytime axios request hits localhost:3001/logged_in, rails server responses with 304 status. I tried to log the session object in rails, but it is always empty. Using rails 6.0.3. Note that all my axios requests have withCredential: true included.
Hi, problem solved. Just get back to let people who also have this problem. Since I init the rails app with --api flag, additional config needed here to save cookies. stackoverflow.com/questions/57680527/cookies-not-saved-in-rails-6
I'm having an issue when refreshing page and the state changing to NOT_LOGGED_IN. I can navigate between pages just fine and I stay logged in but on refresh it reverts back to not logged in. Any help would be appreciated.
I have a question: if the authentication is managed by the variables states, some user can change this flags by his browser (for example: i change manually the status of 'loggedInStatus' in 'Logged_In'). Could be possible? If yes this could be a problem :O
Yes, which is why I mentioned that all of the server side requests need to have authorization rules implemented as well. The front end auth rules should just be for UI (showing/hiding buttons, etc), not for managing the actual data that a user should see.
hey i seem to be having this issue, why does it automatically log the user in right after registation, can't there be a prompt to ask the user to login after creating the account and how?
FYI dude I just deployed both the rails api and react spa on heroku - I think they no longer support cookies to the *.heroku-app.com domain. I double checked using Postman and no cookie was provided even though it successfully logs a user in...
The typical approach is to have a loading running and then to only return the loader instead of the component data until authentication has been verified.
@@edutechional could you point to documentation to that, for a loader? shouldn't it redirect back to the login page if you try to access a user dashboard when not logged in?
The standard approach is to listen for the response in the API call and if it doesn't come back with the logged in value, you can render some error text to the user.
(RAILS v6) For anyone running into issue: "logged_in": false, try updating your application.rb to include the cookie middleware inside the module and application class: module _app_name_ class Application < Rails::Application ... config.api_only = true config.middleware.use ActionDispatch::Cookies config.middleware.use ActionDispatch::Session::CookieStore config.middleware.insert_after( ActionDispatch::Cookies, ActionDispatch::Session::CookieStore, ) end end Of course this probably only applies to you if you used the --api flag to create the rails app. Let me know if this helps
![⭐ฮิตในTikTok!! ( หมูเด้ง MooDeng ) Ver. แดนซ์โจ๊ะๆ ReMix BY [ ดีเจกิต รีมิกซ์ ]](http://i.ytimg.com/vi/3krsyfWUeHU/mqdefault.jpg)
Awesome tutorial! This is exactly what I am looking for after being very frustrated with gems such as devise, will be watching more videos from you! Thank you!
Same issue with the rest of the comments. Tried on a rails app, and was not able to get logged_in to be true
Thank you for this tutorial, it has been very helpful.
(Solution to a problem I faced ahead): I ran into a problem where I managed to login my user, but when I tried to GET the logged_in value, it was always False. The json view of the localhost:3001/logged_in was also false no matter if the user I tried to log in was valid or not
Thought it might have something to do with the API only flag in my rails application, and although that might have contributed to the problem, it still persisted after reverting to ::Base. So my solution was to head to chrome://flags > SameSite cookies > Disabled, and it worked.
For some reason my chrome was disabling my cross-site cookies from being sent on my heroku local. Hope it helps anyone that comes across this problem.
thanks bro
Thank you for the quick tutorial, really helpful!
Please also note that you have a small typo at 6:23 , I think you wanted to use a logical AND instead of a bitwise one?
Great video. Btw I came across this exact (down to the code) tutorial on medium earlier today. Someone’s passing your work off as their own.
I'm glad that you found it helpful and thanks for letting me know.
When I deployed the application to Heroku the back end and the front end to netlify the session is created by the logged_in method always says the user is null, why is that? if I am working with localhost it works fine the session is created the logged_in checks the user session and displays the correct info but I am on production the logged_in value keeps on giving me back user null, why is this happening? is the only step left I need to finish the project can you please point me in the right direction
Simple! Powerful! Easy! & It's what I am looking for !!! Thanks a lot!
Thanks for the tutorial! In addition, I would like to seek advice on approaching the situation when the user refreshes the page, will the state be persisted? or the user will have to re-login. Is there any way that I could persist the user login state when the page refreshes? Thanks. I know local storage is one way of persisting but the user can manually enter the value and login to the dashboard. Thanks once again.
Bu i can modify response and make it to be true. How we can protect users to modify our state, cookies, localStorage and where to store loggedIn variable to ask our script is user is logged or not?
great video, quick question how can i use the user email to display it below the status? I know that inside the handleSucessAuth i can do a console log to get the users email information like this console.log(data.user.email) and I will get the user email how can I use this to display it below the status when the user is logged in ?
Whenever I refresh the page, the page will show that the user is not logged in for a fraction of a second before changing to logged in. I know this is due to the "logged out" state being the default state of the component and that it rerenders to logged in after doing all the authentication stuff.
My question is how do you avoid this and persist the logged in state so that it doesn't visibly rerender upon refreshing? I've seen some websites do this and I want to learn how they do it.
You can create a 'loading' state and not render anything on the page until the API call is complete and then change the loading state, that's the standard approach.
hello, i have problem with something, so in response i have only loggen_in:false dont know what is problem and i dont have user from api call
Probably i have problem with :session because if session sent me false
Hey, great video; however, what if my site is client side (only loads the page when I search it)... aka, component will only mount once.
So if I search my sites URL the check will occur, but if I open a second tab and search it, that will also pass because I'm logged in. So, now I have two tabs open for my site and I'm logged in, but if I log out of one, because it's client side, the page won't reload... so the other tab will still operate as if I'm logged in. How do you fix that? Hopefully that makes sense, if you need me to reword please let me know.
For something like that you could integrate a websocket that listens for events, such as a logout event and then when it occurs, the React app could trigger the redirect.
edutechional genius
@@edutechional Thank you for your response, I have one more question about a request regarding "fetch", I know you use axios. I know you're probably too busy to check this out (I understand), but I've been stalled on this problem for 2 days now and am not making any progress. Any help would be greatly appreciated!!
Here's the stack overflow question:
stackoverflow.com/questions/63351799/react-fetch-credentials-include-breaks-my-entire-request-and-i-get-an-error
what is logged_in ? any link to the previous video .
Hi there, I follow until this and cannot perform check if user is logged in. Seems like the previous requests didn't store cookies on my browser. Where should I start the investigation?
Everytime axios request hits localhost:3001/logged_in, rails server responses with 304 status. I tried to log the session object in rails, but it is always empty. Using rails 6.0.3.
Note that all my axios requests have withCredential: true included.
Hi, problem solved. Just get back to let people who also have this problem. Since I init the rails app with --api flag, additional config needed here to save cookies.
stackoverflow.com/questions/57680527/cookies-not-saved-in-rails-6
Yes, that's why I created the app like a standard MVC based app, the API only flag doesn't include the ability to work with sessions.
Thanks man, even though ot took me 2 hours to check the comments.
@@edutechional you should mention this in description for people using --api
OMG thank you i was trying to figure this out for hours
You saved my day, with the axios config withCredential true !!! thanks
Glad I could help!
I'm having an issue when refreshing page and the state changing to NOT_LOGGED_IN. I can navigate between pages just fine and I stay logged in but on refresh it reverts back to not logged in. Any help would be appreciated.
Here is the repo. Any help would be greatly appreciated. github.com/joshuaneedham/rails-react-auth
I had to move the before_action that is in the current_user_concern to the sessions_controller and it is working perfectly.
why you didn't show the form?
I have a question:
if the authentication is managed by the variables states, some user can change this flags by his browser (for example: i change manually the status of 'loggedInStatus' in 'Logged_In'). Could be possible? If yes this could be a problem :O
Yes, which is why I mentioned that all of the server side requests need to have authorization rules implemented as well. The front end auth rules should just be for UI (showing/hiding buttons, etc), not for managing the actual data that a user should see.
A good question and a good answer :)
Thanks for the video.
The staying logged in doesn't work even though the cookies are definitely stored in the browser
hey i seem to be having this issue, why does it automatically log the user in right after registation, can't there be a prompt to ask the user to login after creating the account and how?
If you want that type of behavior, you just wouldn't store the user_id in the session in the registration create endpoint.
FYI dude I just deployed both the rails api and react spa on heroku - I think they no longer support cookies to the *.heroku-app.com domain. I double checked using Postman and no cookie was provided even though it successfully logs a user in...
The apps needs to share a domain.
Is checking user sessions in class component's constructor a good way to control access? I want to check if user session is valid before render.
The typical approach is to have a loading running and then to only return the loader instead of the component data until authentication has been verified.
@@edutechional could you point to documentation to that, for a loader? shouldn't it redirect back to the login page if you try to access a user dashboard when not logged in?
If they fail login, how to do you provide the error message back on the form
The standard approach is to listen for the response in the API call and if it doesn't come back with the logged in value, you can render some error text to the user.
Great content here...
Thanks for sharing
Thank you for this tutorial!
You're welcome!
Excellent this is what I was looking for
I'm glad that you found it helpful!
(RAILS v6) For anyone running into issue: "logged_in": false, try updating your application.rb to include the cookie middleware inside the module and application class:
module _app_name_
class Application < Rails::Application
...
config.api_only = true
config.middleware.use ActionDispatch::Cookies
config.middleware.use ActionDispatch::Session::CookieStore
config.middleware.insert_after(
ActionDispatch::Cookies,
ActionDispatch::Session::CookieStore,
)
end
end
Of course this probably only applies to you if you used the --api flag to create the rails app.
Let me know if this helps
thank you very much, it's been really helpful. like and subscription :)
Thanks!