Transcript
Looking for something specific? Feel free to search the page for keywords to find a specific portion of the live stream that interests you most.
how's it going everybody it's been a little bit um so moved into the new house got all
situated here got internet finally and so at the old house my entire life i've
always used a wired internet here i am trying out t-mobile home internet
which actually uses lte and 5g signals to receive
the internet reception and then it has a little gateway box that receives that and
thank you ahmed thank you for confirming that and i had issues throughout the past week with it actually overheating
because i had too much connected to it so i had to get a router so
so once i got that hooked up and i get everything hooked up to the router and turn the wi-fi off of the gateway it seems like it's it's stopped overheating
because whenever it overheats the internet just completely goes to put and it stops working so
um cool i wanted to just kind of stream for a little bit here to test and make
sure that everything's working okay with that uh and i figured while we're here
um i was talking with the free tier on discord and he ran into an issue and
i realized hey i'm running into that same issue or i have that same bug in my application so
here we are with the new not yet released jaeger site which the name will actually
be changing whenever i do release it but the ultimately the issue is so
i have a google and a github login and i believe i streamed that whenever we set
that up um and whenever users log in all that works
okay so if i come in here and i'll log in with my github it should work okay i'm not quite sure if i'm actually yeah
so it works okay um obviously i have an issue with my image but that's
completely separate from what we're going to be focusing on here today but the issue is so whenever if we dig
into that code here i believe i put that inside of a service so let's go into services http
auth social service um so we have our get user and then we have
the find or create user and that's where the actual issue is so we come down to here we can see
that i am querying for the user and if the user is not found then i'm going ahead and creating that user within my
database the issue is i'm using email to check whether or not that user exists already in my database
the reason why that's an issue is what if i go into i'm not going to do this but what if i go into my github and i
actually change my email well whenever i go to log in the next time i'm going to be receiving that new email
via the social auth and whenever i do the lookup inside of my database
i'm not going to have that new email to find the user against so that new user
is going to get a whole other user created within our database and so we're going to get kind
of a double user scenario going on there where one's old uh and one's new but then they're going all of their
information within the application is going to get siloed between those two so
the easiest way to go ahead and fix that is to and i just closed it
um so if i open up table plus
and let me connect to my local and
if we go into our users you can see that we have the you know we
have the github access token and that's really all that we're saving that's particular to the github user beyond
their email but what we can do is we can add an additional column in here
called github id and then we can do the same for google should have a column in here for
google somewhere as well i think maybe not but we can do the same thing for google and get the google id and then instead
of checking for the email we can check against the github id or the google id
that way if the user changes any of their personally identifying information we'll still have that id to look back
against to confirm whether or not that user exists within our database so let's
go ahead and node ace make migration i might be a little rusty
here today it's been three ish weeks since i've really worked
with adonis i don't get the privilege of working with it at my day job i work with c-sharp and asp.net
so javascript's not even really my main go-to anymore unfortunately um but so let's go ahead
and do node ace make migration um let's do
oh wow is that my computer fan it is i haven't yet to hear that so i'm kind of surprised that i'm hearing
i don't have the ac on and that's about 80 ish degrees in here right now so that could be y2 um okay so nowadays make
migration and then let's do add social
auth ids and table for that should be users so that's going to create an alter table
migration for us called add social auth ids we can head into our applications
find database in here scroll yo on down to there and here is
our migration so really all that we're going to want to do is and let me take a look at that
again do i really not have take a look at the structure
github oh yeah no there's google access token okay i was completely just overlooking it so we'll do
um github id
is that man i am no that's not right like i said it's been a
minute uh integer github id
unsigned uh it's not going to reference anything actually and we'll also want to make
sure that it's nullable nullable's default but i'm going to put it there just so it's explicitly known
and won't have any possibility for confusion and then we'll do google id as well
okay and then within our down let's go ahead and remove those two columns
um again i like to do them one by one in case for any reason during development stuff changes
it's just easy peasy and it doesn't take that much extra time to go in here
and add the additional drop okay so let's give that a save and let's go
ahead and run that migration so node is migration run
i'm gonna be questioning everything that i type here today all right so that ran uh looks like it ran with a couple of
others oh yeah i prep those um that's gonna be the next stream um i started working on
that a little bit i didn't mean to but i did um okay so we have those so let's go ahead
and add the github id and google id into our user model so let's go to models user
and let's see let's put these right before the access tokens so right here
column uh uh yeah public oh wow
kind of skipped over that on these didn't i i was gonna say something doesn't look right here public public it doesn't matter a whole
lot i believe public is default but uh let's put them in there so that i don't
confuse myself further next time um github id
that's gonna be should be a number i believe i have no clue what google provides it i'm gonna assume it's gonna
be a number we will find out
okay so there we have our github and google id so then let's go into
our no auth social service there it is
um and in addition to i didn't realize my dog was down by my feet and give her a
little nudge um in addition to all of this let's add in
see so we should be able to discern what provider we are using if i can remember which
property that is out of here social provider
key of social providers so it's most likely going to be that
i would imagine yeah it should be
so it should be the social provider right here so should be able to do
uh yeah yeah because that's the token key so that would be
the uh github access token and google access token right up here
so let's do const keep that naming token id or user id
yeah let's do user id equals social provider
id and we'll type that in right down here so user id
and that should be user dot id
give that a save let's go ahead and try logging in again just to see whether or not that gets
populated within our database we can go in here and verify that it's actually null
so if we come into our data side of it this one right here is my github user
it's going to be all the way at the end and yeah so it's an all right now so if we come back into here try signing up
with or logging in with our github okay we are logged in
let's come back over here and refresh and we should have some kind of an id and we don't
okay well yeah because the user already exists so so
in addition to that since i already have users within the production database using this what i'm going to do is just
a next time the user logs in let's check to see if that's missing if it is
let's go ahead and populate it in so if jager user uh let's go ahead and do an else
if not jager user
[Music] yeah not yanker user dot
user id key that should have a key behind it
because that's not the actual id there we go user id key
it's not very pretty but it should work and that just oh i really did it
user id key there we go okay if that's missing then let's go ahead and just populate it
in so um jager user dot or not dot user id
key equals user dot id and then jager user dot save
um oh wait yeah i'll wait okay let's test that one more time
okay sign in bam
looks like it went okay and there is our github id right there so that seems to be working okay uh
doesn't look like i actually have a google user because all of those
access tokens are null but since the email is already in here
it should find that and just populate the google id onto that particular user so
let me go ahead and try that real quick see if this is working oop nope
insert into users and oh yeah that's definitely out of uh
intensive range so okay we're going to need to change that to
what is that a big let's head over to
the adonisjs documentation take a look at what options are i believe it would be big in but
i am not 100 certain so uh let's see we'd be wanting to look
for migrations here tom model factories do do do i am
blind i know it's right here should keep my migration all right
actually this might be in the reference
hmm
been a while since i have looked at the migration stuff
okay oh no i'm back at context how did i get the context
schema migrations altered table
okay um go ahead
it may not be listed on the adonisjs documentation let me go into
connect.js i know this is really small let me go ahead and it's hard for me to even read
it let me zoom in a little bit here uh so
schema builder i believe this is the right spot so there's big ant
uh note that it's returned as a string in queries because it can't parse them
so that is one thing to note so we could just save it as a string and call it a day
but uh we'll try big and we'll see if that works so let's head back into our migration
before let's go ahead and roll back real quick node ace migration
roll back okay and let's change you to
big it may be beneficial to just go ahead and do that for github as well because
with the amount of users that github has it may eventually reach that point as well
so let's go ahead and just try that with that as as well
okay so node ace migration run if this doesn't work then i may just go
ahead and save them as a string and call it a day because why not
it'll still work it'll still be unique within our system
all right here we go and so let's try
github first all right looks all good there let's verify that
the so this column should look the exact same refreshed and there it is
only difference is that whenever we try to query that it's going to come up as a big int so the main thing would be
whenever we change this to checking for the um
github id we want to verify that that user is actually found
since that will be compared as a string and it still does not okay out of range of big n as well
all right um like
hesitant to do a double
let me just go ahead and do a string let's stretch string
let's do node is migration roll back
okay
strange string that would mean that unsigned is no
longer applicable there we go give that a save all right i'm going to go ahead and go
back into the user model let's change these from number to string um since we were using big in and it's
returned back as a string that might have been a string regardless anyway even if big n did work
not 100 sure how that would work and let's go ahead and run that migration again
it's one of those trial and error type things you think it might work a particular way but you're not quite sure until tree until
you try it all right so there we go got our migrations running come back in here refresh that should be empty it is let's
come back into our application let's go back let's go ahead and try google first since it's been
failing cool so that is working we can go ahead refresh here oh it created a
new user ooh that's not what i want
see it should have found this one so now that email's not unique
peculiar
okay we'll look into that here in a second let's go ahead and try github
just verify that that's working
okay all right yeah so that one worked okay that wouldn't create a new user on us
curious as to why google did so
it could have now should have should be checking based off of the id or the email there
let's double check so that would be the social service
oh we're not null token key okay
see so we should be able to just go ahead and get rid of that as well so if the email's in our system why not right
why separate the user out um because if they're
okay let me go ahead save that let's delete that extra user that got created here
okay ah created a profile form too uh let's see
so go in here let's delete that row come here and delete that row
okay there we go all right let's so let's uh let me double check make sure i saved
insanity check there yeah all right so let's come back into here and let's try that one more time so let's sign out
i'll do some additional thinking behind this to make sure that this is safe to do here uh it would
definitely be safe if i had an email verification like you sent off
uh verify your email address you know but there is that slight possibility of
since i'm not requiring this particular user to have that particular token id of somebody signing up for a particular
email and then somebody else coming along that actually owns that email and using a social provider but
i don't think that would happen very often and i do want to add an email
verification step within here anyway so once that is happening then this would be a safe bet
to do okay that was a long ramble sorry so
let's go ahead and try this again me thinking out loud all right there we go
and it doesn't look like a brand new user got created and there is our google id
up on that correct user cool
so then the last thing to do would be we'd want to switch this to
let's see here
trying to think if there's a way to where i could just switch this to checking the id but i don't believe so
because we still have all those users that signed up that we don't have the id within the
database for so let's go ahead and do
an or where
user id key
is user.id
okay so now that should work as well um
and in order to test that i think i might just uh comment that out for right
now and put oh did i capitalize that oh yeah well yeah or in front of it okay so there we go so let's go ahead and test
this out with this commented out to just make sure that the system is finding
the user okay by their particular social auth id
let's go ahead and sign in again let's sign in with get uh google
tell us the end of a work week refresh here all looks good no extra data added in
and we were successfully logged in using just the uh social auth id so that is working
okay for google let's go ahead and try this again for github
okay logged in okay there
and no extra data added in for that either so that's working as intended
let's go ahead and i'm gonna have to think through this a second on whether or not i actually do
want that and where not null
out i definitely want the emails to be combined
into you know so like i have i already had my email for my gmail signed up
obviously but whenever i actually went through with the gmail social auth i do want that same user to be bound to the
gmail social auth or google social auth i think the safest way to do that would
be to add an email verification step to the email password login that way
i know for a fact that they own that email address and it's not just some random person trying to pick out
some user's email address and then whenever that some user comes along to sign up now we have
a password that one user owns and a social auth login another user owns that wouldn't be a very good scenario so
but i do definitely want those records combined
so yeah for right now though while i don't have
that uh email verification system in i think i feel safest
having those separated or even just disallowing a social auth system and then saying log
in with your email and password and then add it into the back end whenever the user's already logged in
that would actually probably be the safest bet is to say if you already have an account with us
and it's not github or google then you need to go into your settings
and add that i like that better that that sounds like a better approach
so we will add that back in without was that aware not
no i guess it would be
well yeah no token key that should definitely work
yeah
okay so then we'll put that back in and now if
i remove the github id there
oh wait i also need to remove the google app oh no okay that's not there
why isn't that there shouldn't be there
now it'll be there there we go
okay so let's go ahead sign out
um and let's disallow the user from actually signing up with
google whenever they have the email already on our system but it's not bound to
uh a particular social auth and it will force them to do that within the settings that way we know that they
have access like that that is that user um so
what would be the best way to do that
so if they don't have a user that gets created we definitely want to allow that if they don't have
see so at this point we just have the token key created within our database for those
pre-existing users so we'd want to check the token key
now let's do it separate else if
and then let's check the token key on that so if not
if they don't have the token key saved then we want to disallow the login
and let me see whether or not i can just return null from this probably not i would imagine that's
expecting user yeah it is so
all right i'm gonna try throwing an error here and just seeing how i'm handling that
i may need to do this more gracefully or wrap this in the try catch or something like that so let's see throw
new
unauthorized exception i don't know if that would be the right exception or not but we'll go with it for right now um
which will be the verbage for this
an account
i don't know that works for right now we'll see whether or not that works for what we need
all right so let's come back in here so it's a google that should now break it shouldn't work
let's see what happens it worked it didn't didn't break
maybe i didn't save oh okay so
um
that's odd it should definitely have reached here see whether or not we can see that
exception on our server we got a bunch of stuff um
no no we can't
all right well then what's uh
[Music]
why what the token key is still null
that is or no never mind that be down here so it created a new user so it means it
didn't find it so that means that what i'm actually looking for is up here so it didn't find
the email where oh we're not at all yeah okay so we do want to actually take that out because we have now this check here
so can't check if you know get the user back so all right let's try that again so i need to go
back in here delete the profile first boom
and then delete that user again and all right
let's try this again all right sign up
google should get back in there let me actually open up the console well shoot
it worked workday okay what did you create another user on me again
yeah sure did
hmm oh i just forgot to switch this to an or where that wouldn't find any user
there we go all right now it should work let's uh let's run through that this is why i shouldn't stream on a
friday night at the end of a work week uh let's see profiles
bam users bam all right let's try this one more
time let's go back into here sign out cool
sign in let's hit the google button and
there we go now i want that to be graceful i wanted to
go back to that page and just show an error i don't want this to happen um
so let me see where i need to catch that at so this is called by this it returns back this
so i would say to catch it right here
okay uh yeah
there we go okay so now we should be able to catch that now we need to see what calls get user
that's probably inside of the controller i would imagine so let's jump back into our social controller here
yeah get user so we have all right to route auth sign in show
and let's do um so we got that
let's just grab the message out of there so let's do a see we need session
and um [Music] the off page has a particular
flash that it's looking for i believe it might be this
i'm going to just copy and paste this in here easy enough to type that in but uh
yeah all right try just dropping that message in there
let's see if that works so now whenever that fails this should redirect us back to the sign in page with
that message instead of showing us that big old error page let's just test this and see if
that works all right so we came back here uh
doesn't look like that was the right flash message
yeah it should definitely be the right one i must say that's just not working
but it should be tested before errors oh it's errors this is different
let's try that or maybe the message was empty i don't know maybe the message isn't right
try this again as a sanity check here first though let's see what now this works okay
so the issue maybe message or the message yeah so let's uh see what we're capturing there within the
service
just spread that out and see what we got okay
uh an empty object cure qqq
okay
try this just as an error maybe
the object
all right i'm going to put this in layman's terms that i can understand here
i don't know why that wouldn't be capturing that
yeah that's even cleaner okay i like it somehow that worked better um
cool oh yeah we can get rid of that
all right let's see here so let's try that one more time
all right did i remove that console log yeah that was an error with it um
hmm it should be returning back there oh yeah but
[Music] uh social controller
message does not exist on type yes it does it's right there you have it
listed it's right there
all right let's console.log out whatever the message is here just to verify that we're getting it to
this point
and yeah yeah so it's it's the flash um
which is weird because i thought i had that working
see the other one that we had there was air maybe that's right
because now if i try to log in
the bad password it shows up it does work
um let's see oh is it
take a look at that one more time not foreign my goodness yeah so it's
errors inside of form
there we go that should work blame my previous soul for not making that self-explanatory there all right
let's try that one more time there we go this is the message
so let's plop that on there get the actual message up um i'm gonna ignore that because that's visual studio code
that's one thing i liked about um uh webstorm is it
the typescript stuff was always up to date you didn't have to worry about it because it was very good at keeping that up to date
um so let's see let's where's our message at access was denied request expired
this is the message
the email see now i need to think up a nice message for this to be
let me break this down because this is not going to be a short message i imagine
the email time to this provider
already has an ec no that's not good
this email is already tied to an
account please log in to your
account and uh
assign and
add
social provider
please log into your account and through your
settings not great but i'll workshop it let's just see how it comes back
this email is already tied to an account please log into your account and add google through your settings
good enough um
using your password
okay so that's good enough on that front um now what we want to do is
we should pretty much just be able to add these two buttons into the settings page um
and then we can add an additional check to see whether or not the user is authenticated and
whether or not the email matches so if that if those two cases
are good then we are going to go on this
thank you for confirming that no um
um nahim sorry about the name butcher
there but thank you for confirming that the full hd and 60fps is working okay i
appreciate that um so let's go ahead and add those
buttons in so that would be let me collapse this stuff up resources views off
sign in all right scroll down i should have these commented out so that i can easily
or log in with i don't ah okay so i'm just gonna go ahead and grab
these here that is that i think i need to grab
that div too no that div is this one yeah okay
and then let's head into the settings page that's inside of studio
settings index i'm going to have to go to this page to actually remind myself what it looks like it's been a while
okay yeah oh wow none of the uh
well i might have broke that while i was dealing with the google stuff but that was working
probably overwrote it from whatever google set it to so let's see here
yeah just add another one of these sections here for social authentication or social providers
and that should do it so let's see where would be best so change username
update email email notifications
do it after update email i guess update email
okay
uh add a social provider to your account
volume is low i think i can fix that let me try to is this
any better here is this any better i need to try to not talk louder and
talk at the same cadence than i was before
last thing i want to do is turn the volume up and talk louder all right so
add the social provider to your account uh
add a social provider to your
account so you can log in and
all right there we go that should be fun and okay
uh this shouldn't need a form at all should just be able to plop these buttons in here the form
section is just purely visual uh structural i mean and then
yeah i'll go ahead and leave twitter in there i got an email a little while ago about twitter changing their
application process so maybe i'll be able to get that eventually um
um cool so then those buttons should show up right here uh i'd prefer them to be
vertical but i'll work on that later uh main thing is we need to add the callback for this
whenever we click on it to check to see whether or not the user is authenticated if the user is authenticated then
we really just need to check whether or not they have that email so right here is where we're going to be working again
i just pretty much need to make that faulty if uh well okay so let's see we do need to provide in the user
through here so i guess this would change up a little bit with it social provider because
well no so this is extending the http service so
uh i have access to everything right here so that's that makes that nice and easy so
we have our user here our jaeger user here so let's do const
auth user equals this ctx
off user okay and so that can be knowledge so else if
not [Music]
let's see end of day if statements are always
i don't know why but they always trip me up um let's see off dot
email does not equal
user dot email
and
let's see would that work also this off user so if the authenticated user
if their email does not equal the user email well in that case we would actually want that to be a
different error altogether because there you're trying to
go against with a different one so if not uh auth user
for that one and then we'll do a separate check for what i was just trying to do so else if not um
user email does not equal uh user.email
then we get into a bit of a finicky state where we have
somebody trying to attach
well i don't know if that actually would be an issue because say i sign up here
and i go i log into google i i'm confirming that i have access to
that google account because i'm able to log into it so if the emails don't match
what's it matter still the same yeah
so okay so pretty much just stating whether or not if the user's not logged in then we
want to perform that previous check to see whether or not they have a social authentication token otherwise
we're just going to go ahead and merge in their social auth information with their current user information
i think that sounds right so before i do that let me go ahead and just do a sanity check here make
sure i didn't break anything with how that's working previously so
google should come back get in there yep okay
come back over here sign in come down to settings
and of course uh this shouldn't error out but if for any reason that it does i believe i'm going to want to add some
kind of messaging in here well actually it would redirect me back to the login page wouldn't it which would redirect me elsewhere
yeah that's a that's uh
yeah so that could use some work so maybe it's that does need a separate
endpoint um but let's go ahead and see whether or not that actually worked on the database
side yeah it worked on the database side so here now we have our google id here now
we have the google access token it
did break my avatar previously but it shouldn't any longer
or wait did it no it shouldn't shouldn't have that was probably just broken before
for some reason uh but okay yeah so this seems working okay
and the next thing that we would pretty much want to do is to disable that because
you should be able to add more than one google account um
let me see whether or not we have the should have the auth well yeah you have the auth user there so
[Music] let's see here so
i'm gonna all right let's let's see here if
um off dot user
dot
google access token
and let me do that
there we go now i don't need to do it twice
all right
i should have refreshed but yeah so now that's not doing anything
whereas github still is so let me go ahead and
okay let's do a sanity check there so one should be disabled one should not
google is this one is not and it would be working a-okay as well so
cool now obviously we don't want that hover and it should look a little different
okay otherwise it's just going to be text gray i don't know 400.
yeah um oh
okay let's try this there we go and then probably put a message this is
already bound or this is already tied to your account or something like that
would probably be good to save the github and google email addresses too that come back with that user
just in case they are different i'm not going to do that tonight but you'd also be able to state that here as
well and then we could add in like a detach button as well
under here instead of just saying that it's already set up that way if they need to switch their account or whatever
they could detach it and then reattach a different one and really that wouldn't be too much work it would just be a matter of
clearing out those particular database columns so you would clear out the google access token and the google id
and then as far as our application is concerned you know that
the account's no longer tied to that social provider
there we go so i'll work on that um off screen to finish it up but uh
i wanted to at least stream a little bit here to see make sure everything works okay um
and we'll move forward from here um sorry i wasn't at my best today it's been like i said a couple of weeks since
i've actually worked with adonis and it's also a friday evening so um i'm
gonna relax y'all have a great weekend i'll probably stream a little bit tomorrow uh there's some additional
stuff that i want to get done and i'm hoping to be able to get this site out i was hoping to get it out last weekend
but stuff happened
Join The Discussion! (0 Comments)
Please sign in or sign up for free to join in on the dicussion.
Be the first to Comment!