For anyone else who has an issue with sign out causing the app to freeze, you need to change the code he wrote at 10:50 to: supabase.auth.onAuthStateChange(async (event) => { if (event == "SIGNED_IN") { navigate("/success"); } }); Something must have changed on Supabase side which causes this event listener to trigger an infinite navigate loop.
Been trying to find a good Supabase authentication tutorial for a long time but the other ones were very confusing. This video really helped me. Thank you so much!
Hey It's Cooper Codes, Supabase changed their UI since the recording of this video but everything you need to find regarding Supabase setup should be in the menu here: imgur.com/a/6lIzDPh the redirect URL and other things got tucked away into different sections so hopefully there isn't too much confusion here. Comment here if you are missing anything! Thanks.
Is there any way to not have the login page redirect the user to the success page if they are already logged in? If someone is just interested in switching their account, then this may be useful. I guess what I'm looking for is how to only make it redirect when that user actually just clicked "log in" and not whenever an already logged-in user goes to the login page.
Do you think it’s possible to only allow “Sign in with Discord” only if the user is part of a Discord server? Would be cool to give Discord server members access to custom dashboards with their stats.
I can definitely integrate something like this into a project. My first assumption is that you create some auth middleware (some in-between steps with your authorization). When you authorize a user on your webpage, you can check the supabase user object to see 1. They logged in with discord 2. Make a call to the discord API with their credentials, seeing if they are part of a certain server. I will note, for a sign in like this you can actually make it so supabase ONLY allows Discord sign ins (pretty legit!). Hopefully this gets you in the right direction. You can do this by going into authorizations in supabase and disabling the email sign in (and for the Auth component shown in this video there is a property I believe to show only the social logins aka Discord on the front end).
Could you provide an explanation? This solution is generally standard for authentication, and is secure as long as you trust the calls to Supabase to be secure (which I do). Supabase has excellent token management (managing both refresh and access tokens) which is reliable even from an advanced security perspective.
That is because this is a tutorial (and I don't cover everything), you can easily swap those strings out. If you need to learn how you can check out this video here: ruclips.net/video/0i1hGQKw2eE/видео.html . I generally note this in videos when using the API keys in string format but I forgot to mention it here.
Do you mean how to activate a certain OAuth provider (like Facebook or Google for example)? In Supabase you want to go to Authentication (the icon with two people) and then go to settings inside of Authentication (under Configuration), once you scroll down you will see all the possible OAuth providers as shown in the video. At each provider if you click on it there will be a little slider icon to enable / disable that particular login, but you need to have the credentials for the certain provider. For example, to enable Facebook you need the Facebook Client ID and Client Secret which you will get from going over to Facebook and setting up OAuth with them. Once you have the ID and secret you can then enable Facebook for login.
For anyone else who has an issue with sign out causing the app to freeze, you need to change the code he wrote at 10:50 to:
supabase.auth.onAuthStateChange(async (event) => {
if (event == "SIGNED_IN") {
navigate("/success");
}
});
Something must have changed on Supabase side which causes this event listener to trigger an infinite navigate loop.
Pinning this, thanks for providing the code here as well.
legend
Thanks! just what i need
Not work
Thank you
Been trying to find a good Supabase authentication tutorial for a long time but the other ones were very confusing. This video really helped me. Thank you so much!
Hey It's Cooper Codes, Supabase changed their UI since the recording of this video but everything you need to find regarding Supabase setup should be in the menu here: imgur.com/a/6lIzDPh the redirect URL and other things got tucked away into different sections so hopefully there isn't too much confusion here. Comment here if you are missing anything! Thanks.
My man just carried dashboard handling for my bot, tysm
You are welcome, glad it helped :)
Thank you very much! Really appreciate this guide.
Great video! Thanks so much. ❤
Your seriously underrated.
Thank you so much, for some reason I missed this comment. Appreciate the support :)
Hello! I have found that supabase o auth with azure in expo React Native is not working… can you give it a go ? And post a video?
Is there any way to not have the login page redirect the user to the success page if they are already logged in? If someone is just interested in switching their account, then this may be useful. I guess what I'm looking for is how to only make it redirect when that user actually just clicked "log in" and not whenever an already logged-in user goes to the login page.
The best tutorial so far bro! Keep it up, sub
That's such a great help - thank you.
You're welcome Andy, appreciate the comment
Do you think it’s possible to only allow “Sign in with Discord” only if the user is part of a Discord server? Would be cool to give Discord server members access to custom dashboards with their stats.
I can definitely integrate something like this into a project.
My first assumption is that you create some auth middleware (some in-between steps with your authorization). When you authorize a user on your webpage, you can check the supabase user object to see 1. They logged in with discord 2. Make a call to the discord API with their credentials, seeing if they are part of a certain server.
I will note, for a sign in like this you can actually make it so supabase ONLY allows Discord sign ins (pretty legit!). Hopefully this gets you in the right direction. You can do this by going into authorizations in supabase and disabling the email sign in (and for the Auth component shown in this video there is a property I believe to show only the social logins aka Discord on the front end).
The property is called "onlyThirdPartyProviders" and it's a boolean value.
How are you navigating to success page after login? ??
it has been very helpful, thank you.
you're welcome! thanks for watching
Great video ! How do we manage the user who is currently logged in ? Can we store them in a session and use their email as an id for our database ?
Hm how setup it using google and facebook?
What about navigating to other pages? Will the user still be signed in? Do you have to do the Supabase client on every page?
You can pass the userobject down the childs or try using something like redux
You can also use something like private routes
Thank you very much!
is this the free tier ? also what is the diffrence between this and sso
Yes this is the free tier. Not sure about the second part of your question
so i cant get the user guilds with this?
why you can't? I haven't tried, but I think you just have to select guilds in URL generator and then you will be able to get data about user guilds.
hey does it work for a mobile version of the app ?
I believe it should, I'd be surprised if it didn't.
@@CooperCodes thx i'll probably try
This is not the safe way to do it. Seems really vulnerable to me!
Could you provide an explanation? This solution is generally standard for authentication, and is secure as long as you trust the calls to Supabase to be secure (which I do). Supabase has excellent token management (managing both refresh and access tokens) which is reliable even from an advanced security perspective.
@@CooperCodes You put the url and anon key in the login page instead of in an env for starters.
That is because this is a tutorial (and I don't cover everything), you can easily swap those strings out. If you need to learn how you can check out this video here: ruclips.net/video/0i1hGQKw2eE/видео.html . I generally note this in videos when using the API keys in string format but I forgot to mention it here.
thanks for video
How to activate it
Do you mean how to activate a certain OAuth provider (like Facebook or Google for example)? In Supabase you want to go to Authentication (the icon with two people) and then go to settings inside of Authentication (under Configuration), once you scroll down you will see all the possible OAuth providers as shown in the video. At each provider if you click on it there will be a little slider icon to enable / disable that particular login, but you need to have the credentials for the certain provider.
For example, to enable Facebook you need the Facebook Client ID and Client Secret which you will get from going over to Facebook and setting up OAuth with them. Once you have the ID and secret you can then enable Facebook for login.
Fantastic vid
Good Stuff Man
U are the best
More supabase tutorials plsss
I got you with more supabase stuff, thanks for watching!