OAuth2 & Spring boot 3 & Social login | never been easier

what's going on guys welcome back to my channel recently so many of you asked me how to implement oauth 2.0 security also some other view they asked how can I Implement uh authentication using uh social media like GitHub Facebook Google and so on so forth so in this video you will have the answer for both of them yes exactly it's for both of them in this video I will show you and explain how the oauth 2.0 works exactly and I will show you how to implement a realize this using GitHub and Google as authentication providers so before we go into the code and the explanation if you're new to my channel just go ahead click the Subscribe button join our community on Discord and Facebook and don't forget to hit the like button so I can keep continue on producing content like this for you guys and also don't forget to comment out what you really think about this video if it was helpful for you and what are your expectations for the next ones all right so thanks a lot I'm happy to see you again and now let's move on and start our implementation I just want to add one word before we dive into the code and all the technical side so I got a lot of messages a lot of people contacted me and they said that implementing oauth 2.0 is quite heavy quite complicated a lot of technical words a lot of resources and so on so forth but in this video I promise I will make it as easy as you can never imagine yes I'm not kidding but I will make this oauth 2.0 and social login as easier as you can never imagine so it will be with really low code and you will have a working examples and also I will walk you through all the configurations that you need in order to configure your apps on GitHub and Google and it will be exactly the same thing if you want to do it within Facebook OCTA or any other providers just one thing why I did not include Facebook in this because if you create a new application on Facebook you need to send it to the to the Commerce to the commercial teams or like a specific team and this requires some time to get validated and by the time when I recorded this video it was not available to be to be used so that's why I skipped the Facebook but it works exactly the same way so um you're gonna like this video and don't forget to give me thumbs up also leave in the comments what you want to learn next first of all let's enter the following question what is oauth 2.0 so the oauth 2.0 which stands for open authorization is a standard designed to allow a website or application to access resources hosted by other web apps on behalf of a user so it replaced the oauth 1.0 in 2012 and is now the facto industry standard for online authorization so the oauth 2.0 provides consented access and restriction restricts actions of what the client app can perform on resources on behalf of the user without ever sharing the user credentials so this is the most important sentence is without sharing the user credentials so it's like having an application that manages all the users like in in a separate way and then any other application that wants to use this as an authorization system they don't need to provide it or they don't need to request the authorization or the credentials of that user so the user is already managed or handled within a different application and then this authorization server will be just used as a security layer for our application all right so let's move on a bit and understand a few other standards now let's enter another question what are the principles of the oauth oauth 2.0 okay so let's let me give you an answer for that so first of all the first thing that you need to keep in mind is that oauth 2.0 is an authorized position protocol and not an Authentication Protocol so as such it's designed primarily as means of granting access to a set of resources for example remote apis or user data so I mention it again so it's an authorization protocol not an Authentication Protocol okay so the oauth 2.0 uses access tokens okay and an access token is a piece of data that represents the authorization to access resources on behalf of the end user and in oauth 2.0 it doesn't Define a specific format of access token however in some context a Json web token or the JWT format is often used so this enables token issuer to include data in the token itself also for security reasons access tokens may have an expiration date so those are the mental principles of the oauth 2.0 and this is so important to keep in mind in order to better understand what is oauth 2.0 let me now draw the bigger picture of how oauth 2.0 or this what we know as social login how it works all right so when I say social login because we will use one uh or maybe maybe two of the social media applications as an authorization okay so in this case we'll be using uh GitHub and Google in order to access our backend application all right so here we have the big picture of how it works so simply like the simple workflow of that is we have a user here or like an application that wants to access our backend so here we have a user mix request okay and here since we have or reconfigured oauth 2.0 in our backend application so it's not mainly spring or any other backend so it can be any other technology or any other different backend so here the back end will know that he needs to if the user is not authorized so he needs to redirect the user to an authorization server in order to authenticate and authorize the user all right so this is what happens exactly so the our application it will redirect this request so it will redirect the user to login with GitHub using the authorization code okay and then GitHub will show first of all if the user is not logged in it will show this interface right here to enter the username or email and password and then click on sign in but this is not enough because we mentioned already that oauth 2.0 is an authorization protocol not an Authentication Protocol so here like this part or the first part of authentication is just for GitHub to make sure that this user exists within their database but now also you with you will have a different interface where you have a two buttons authorize and cancel just to authorize this application to access this resource or like to authorize this user to access this application all right and once the user validates that then so the request will go back to the like it will be automatically redirected like the user he doesn't need to refresh or do anything but it will go back to the user and then to the back end again and the back end will send back the response so this is the biggest or the bigger picture of how oauth 2.0 within uh social login works so here what we see here like just one word before we move on so he I mentioned GitHub so we can use Google we can use uh OCTA we can use Facebook we can even use our own authorization and resource server so you can create your own you can even for example use key clock and so on and so forth so here's just an example and as I mentioned in the introduction I will make it really really easy how to implement social login so yeah that's it let's move on now and understand deeply how this works now it's time for some action all right let's let's go ahead let's Now understand the like the detailed picture of how the authorization or oauth 2.0 works with social login all right so it starts all from a resource owner and after this part I will explain every word I would be mentioning in here like resource owner client authorization server and resource server all right so don't worry about that just I need you to focus and understand how it works exactly so like here start imagining with me you are a resource owner so it's you or me or any other user so here first of all we will perform a request using our browser okay so I will perform a request localhost and then the port 8080 for example slash API V1 secured or any other secured endpoint so it will be sent to my client which is in this case the browser okay or Postman or whatever so this is the first step then the browser will check so actually this is not happening hundred percent uh on the browser side but we have some information that these request of this resource is secured or protected so it will be automatically redirected to an authorization server so the Second Step it will be redirect the authorization to Authority authorization endpoint which is in case in this case here for example I mentioned GitHub and by the code later on we will be using GitHub or Google both of them so but here just to simplify the the flow I mentioned GitHub so it will be sent to the authorization server and then the authorization the authorization server will check that the user is not valid or the actual doesn't have the access token and so on so forth for some reason the user needs to perform a login or to authenticate okay so here comes the third step which is sending the send redirecting the user to authenticate so here it will show or display this form right here okay so here ask for authentication so it goes back to the resource owner and here the user needs to do something okay needs to interact and from here we see the fourth step which is authenticate with user credentials because here we are within GitHub and you need to have an account on GitHub in order to be in order to get the authorization to access this back end all right so this is the first step authenticate with user credentials once the user is authenticated I just go back and mention again that oauth 2.0 is an authorization not an Authentication Protocol so here comes the best part which is asked to authorize client and as you can see here here we have Aleppo coding GitHub by Ali alibu Ali and so forth one would like permission to this one and here also if you have or if you provide Scopes they will be mentioned here and here you see like authorize alibu coding GitHub or cancel and once you click on authorize this will redirect the client with the authorization code that was generated by this authorization server and then comes the seventh step so here it's an automatic redirection so the user he doesn't need to do anything so he all he need to do uh having the the endpoint URL and then if he's asked to authenticate an authorization and authorize the real the resource and that's it and the rest will happen like magic all right so the next step is navigate back to client with authorization code after this redirection right here and then comes the green part all right so the first part is for the full authentication and authorization process now the green arrows is now the flow that happens again all right so in order to get the response from our backend so then after navigating to the client again the client needs to perform a check so each time the client needs to perform some check so it will transmit the authorization code and the client credentials to the authorization server to check again if this code is allowed to access these resources all right and then the authorization server will return a valid access token and then finally this access token will be sent to our backend as a header and we can see here like we will perform the call to this API everyone secured and then the backend will send back the response and it will go back again to to the final user or to our resource owner so so this is how it works in detail so this is the flow that happens and like there is there is no magic behind that it just you need to imagine that it works like that okay so as I described it just imagine and we will see it in action later on all right so first of all let's focus on the theoretic part part how things Works uh and so on so forth all right so that's it all right now let's uh give a definition or explain these four big parts we have right here which is resource owner client authorization server and the resource server all right so I will give you the definition or the simple definition of each part of it and that's it and then we will we will be good to move on so first of all let's start with the resource owner okay so the resource owner is the user or the system that owns the projected the protected resources and can grant access to them all right next we have the client right here so the client is the system that requires access to the protected resources or to access resources the client must hold the appropriate access token so the client you can consider it as an app or a browser or something like that so any client that wants to access or to require access to the protected resources the next one is our authorization server So This Server receives requests from the client to access token and issues them open successful authentication and consent by the resource owner all right so the authorization server exposes two endpoints the first one is authorization endpoint which is handle the interactive authentication and consent of the user and the token endpoint which is involved in a machine to machine interaction all right and the last part of this is our resource server right here and as I mentioned the resource server simply you can consider it as your backend okay your backend application where it's the protected resources that a resource owner and a client wants to access all right so I hope now everything is clear and now let's move on and do some action so as I mentioned before in the introduction of this video I told you that I will make this oauth 2.0 and this social login as simpler as you can never imagine all right and this is not me okay I'm not so that powerful or like I'm I'm not I'm not gonna do some magic but spring boot is doing all the magic for us so Springwood has already a predefined implementation or like predefined configuration for one or for these main providers or auth to providers so for example if you want to use GitHub Facebook Google OCTA and so on so forth like well I think these are the four main ones which are defined or like predefined by Spring all you need to do is you go ahead or like you go to the developer console on one of these provider others create your application configure it on Spring and then just secure your endpoints and you're good to go all right so also the good thing you don't need to manage anything no users nothing nothing at all all you need to do is just tell your backend that this is a secure backend and in order to access this backend you need to do this and this or like you need to authenticate or authorize authorize yourself using GitHub Facebook Google and so on so forth like whatever you want to implement right here all right so yeah this is just a word to tell you that the implementation is going to be super easy and you're gonna like it alright so now let's do some action let's get dive into the code so now as a first step let's first bootstrap our application so we will be creating um a simple spring boot application and to do that you know my preferred way is going to Spring initializer and then let's go quickly through these properties you already know that from my previous videos so now it's it's gonna be a maven project of course Java and this is the latest stable version which is 3.0.2 maybe at the time you're watching the the this video you might find a different version but spring 3 is the latest one so now let's create some metadata so it's gonna be com.o Ali Dot oauth 2 and then like the artifact I'm gonna call it social all right so yeah and then you will find all the code available um in my GitHub profile and also will be link linking the the link in the description linking the link in the description okay so this is quite funny all right so packaging jar file and we will be using Java 17 or you can also use Java 19 for that so uh next so first of all we might use lombok and here if you search for oauth 2 you will find here a resource server you can find OCTA this is also one of the one of the authorization servers servers which is by default provided or by default supported by Spring and I will be showing you this in few moments and here you have the Audio oauth 2 resource server this is in case you want to create your own resource server all right ah but for our case our application is just the client of this resource server which will be configuring later on so yeah go ahead add this oauth to client and finally web or spring web because we need to expose some um some information or some endpoint and in our case we'll be creating only one thing all right so let's generate this and then open your project using entityj and let's move on and check that so now we already created our springboot application and it's already open using entityj but before that as we saw in here we need this authorization server so when the user tries to access this authorization server he will redirect him to this GitHub authorization page and so on and so forth so this is what we need to create right now and in order to do that it's so easy just go navigate to your GitHub and here like this is my this is my GitHub account and by the way don't forget to follow me on GitHub so you can get notified by everything I push all right so you might find use useful resources okay so next what you can do is go to to GitHub and then after logging in click on your icon right here and then go to settings all right so after that you just scroll to the bottom right here like on the left menu you see developer settings and within this developer settings you will have options right here so GitHub apps oauth apps and you have also this personal access tokens okay so for the GitHub apps here I have already one app configured which I which I used before now let's go ahead and create a new one okay so click on the link register new good GitHub application I will call it demo app okay or just alibu demo um here for the description some demo app and here you have the home page URL so this is what you need to specify right here so here your home page URL in our case it will be localhost 8080 all right so this is the URL of our home page then you have identifying and authorizing users so this one is the Callback URL callback URL means like first of all this is the full URL to redirect of the user authorizes and installation all right so once the user accepts to be authorized so we need to send him back to the Callback URL okay and this callback URL should be could be the same as here okay so yeah first of all I will add an HTTP right here and then I will copy paste it now and this is our codeback URL so after a successful login we want to go back to the same URL that we came from okay so here we have post installation we can redirect to setup URL we have we can also enable web books and so and so forth but all that we don't need just keep it as it is so for the web books as I mentioned we don't have any workbook so just and check it and then go ahead so here you have this question where can this GitHub app be installed only this account or any account so this only allow this GitHub app to be installed on the edible account or allow GitHub to be installed by any user or organization so I will make it public for you so in case you want to use the same code or if you fork or clone this Ripple and now let's create this GitHub application all right so the first thing that you need to do is to note this one this client ID so you need to copy it somewhere and here we will have also the client secret later on okay all right so this is our client ID and we can also revoke all user tokens and so on so forth and here we need to generate a new client Secrets because as I mentioned before we need these two information in order to perform uh in order to perform any login operations all right so here we have our client secrets we have also our client ID so let's copy this and these two information store them somewhere and now let's move on and they will show you how how you can also create the same app using your Google account now let's also create an application using Google so we want also to use Google as an authorization server in order to access our backend application all right so in order to do that all you need to do is to go to the to the following address which is console.cloud.google.com of course after logging to your Google account so after accessing this one you will have here your Google Cloud platform or dashboard and here you will see all the applications all the projects that you have in this case I already have one but if you don't just go ahead click on new project give it a name and that's it and it will pop up right here okay so within this alibu app the project I'm calling alibu app so you have the dashboard you have a lot of information which is not our Focus for now So within the quick accesses I will click I will click on this one so here we have API credentials and services or API and services and so and so forth so let's click on this one and then if you go to credentials right here you will see that you can create API Keys Services account service accounts and here you see that we have this oauth2 client IDs all right so within this oauth2 client IDs we can create an application all right so I already did one for for the trainings and here you can see we have also the client ID and secret and so and so forth so I will show you how to create another one so just go ahead click on credentials and from this list you see that we have the three options that we have here IPI key or oauth client ID and service account and for our case it's oauth client ID which is important for us so click on this one and from the list right here you can provide order can mention different application types and through our case it's a desktop app so it's not web applications not Chrome it's not Android and so on and so forth so it's a desktop app and here just give it a name let's call it alibu demo and then all you need to do is just click on create all right so once you click on create you will have this pop-up right here so here you need to copy the client ID and the client secret so we because we will we will need them later on or simply click on download Json file so and it will download all the information required right here okay so now we have everything set up let's move on and do some magic foreign so first of all let's bootstrap our application and create one simple or one single endpoint or you can create many or as many as you want but for this demo case I will I will be creating only one and I will be securing all the endpoints so we will be focusing now on this part like the our resource server all right so let's go back to our code first of all I will go to this Source folder main Java and so on so forth and here I will right click here new Java class and I will create a package I will call it demo and here I will click create a demo controller it's just a simple one okay so within this demo controller it will be rest controller right here and also request mapping and for this one it's going to be slash API slash V1 slash demo okay now I will just add one single endpoint as I mentioned because like the focus is not creating uh rest apis but securing our rest apis all right so here I will just do public response entity of type string so I'll just return a hello string so I will call this one hello and then I will be returning response entity dot okay and then here it will be hello from secure endpoint all right okay so this is this is our end point now just to make sure that everything works I will just start the application and check what happens all right so I will start our application of course enable uh annotation processing and then we will go to our browser and so the application is already started I will go to my browser and try to access this endpoint okay so if I go to so here if I go to localhost 8080 slash API slash V1 demo I am automatically redirected to the login page why because within our dependencies we have this security dependency which is this one all right so which is the spring boot uh starter oauth to client so and also we don't have any configuration for that all right so that's why this endpoint is by default secured so we need now to implement something or we need to implement our security in order to do that and also for example if we want to access it because by default it's not oauth 2 authorized but by default it's form login so here you see in the console that we have the generated security password and if you go back to the browser here you use user as username and paste that password sign in and here you see that we have hello from secure endpoint okay now let's move on and add the properties of the configuration in order to enable or activate this oauth2 authentication all right and authorization tool so now let's first create our security config class So within our main package let's create Java class and I will create a package at the same time and here I will call my class security config okay so I think you know my style you are also getting used to it so here we have this our this security config class and we need to make it configuration and also we need to add The annotation enable web security so this this is something that I already explained in details within the JWT video so just go ahead and watch it if you did not yet all right so for the security as you all know that we need let me make this full screen so we need an object of security filter chain so let's create first of all our bin and it's gonna be public security filter chain and let's call this being security filter chain and within this security filter chain we need our HTTP security object let's call it HTTP all right so now we need to return our HTTP dot build and this is what we need to do like this is what we need to return and here it's gonna claim that this build might throw an exception so add here this exception to this method signature all right now it's simple so I will do HTTP DOT first of all let's disable this csrf [Music] dot disable and then I will do authorize HTTP requests and here I will say any request so any request I have in my backend I want it to be authorized or authenticated okay and then of course so here it's just let me add this here so here just saying that I want all my endpoints secured all right so also if you want to authorize some of them you can after this one you can authorize a request but in this case as I mentioned before we will be securing securing all the endpoints we have so here it's already authenticated but spring doesn't know yet which Authentication Protocol or which uh what we want exactly to use to secure this all right and here I will add and and in order to for spring to understand that we want to use the oauth to login form or oauth2 login we need to specify it okay and here we have this option called oauth2 login all right so with this one spring will automatically understand that we want to use oauth2 to login or to authenticate and authorize our users to this backend all right now it's good let's move on and configure this oauth2 so now we have almost everything uh ready except we need to add some resources right here so first of all within this application properties for me I prefer working with yaml representation so I will just rename rename it to yaml or you can just remove the file and create a new application.yaml file so if you want also to keep working or using uh properties it's also fine all right now let's add the configuration for our GitHub and the configuration or the the properties that we already generated right here let me show it to you again so this is the client ID and here we have our client secret all right now let's generate this or let's give this properties to to our application all right so in order to do that it's spring dot security foreign let me not confuse you so it's spring and then don't forget this is a tab Okay and like otherwise you you might face issues so and then security and then oauth 2 and after oauth 2 we have client because we are the client of this authorization servers and then we have registration okay so for the registration means that we want to register ourselves as clients for the following servers all right so here let's first of all so after this registration right here all you need to do is to provide your authorization server name all right and here it will be in our case GitHub the first one and within this GitHub we need to provide a client ID and a client secret all right so the client ID you can whether type it like this or it also works this way okay and here it I will also make client Secret and then all I need to do is going back to this GitHub I will copy first of all this so this is my client ID and now I will also copy the client secret okay all right now everything is up and ready then I will restart the application and show you how this is gonna work okay okay now let's start the application and see what changes are in there so before we saw that by default it was the form login and we had to provide the username and the the password that was auto-generated by Spring in order to access our secured resource now we will be using or will be relying on this okay so here as you can see we we did not mention or provide anything magical it's just some properties and here it's as I mentioned like the registration it can be any name anything you can provide but I will tell you the secrets for this all right now let's go back to the browser and I need to use um an incognito or a private browser why because I'm already logged in to my GitHub account and I want to show you that if you are not logged in you will be interrupted and or prompt to in order to authenticate and I want to show you this phase so now we are in at this level so I'm the resource owner and I want to perform a request to the API V1 secured or demo or whatever and I'm using my client right here which is my browser so it will it's like that localhost 8080 and I have it right here so now as you can see you I have this one sign in to GitHub to continue to alibu demo all right so this is the application that we already created right and here let's go back to this um to this drawing or to this flow right here and now okay so we see that we redirect to the authorization endpoint so we asked for this endpoint the client checked that we are not authorized to access this resource yet so it redirected us to the authorization endpoint and then the authorization server so also that we are not authenticated in order to authorize this application so we were redirected to again to the user and now we are at this phase so the user or me as user and you later on as users you need to authenticate with user credentials okay so let's go back here and I will also authorize me so this is my credentials and then I will click on sign in all right so nice fair enough let's go back here so the user like I authenticated myself and then you see that I'm asked to authorize a client okay so here you see alibu demo by Ali bu Ali would like permission to verify your GitHub identity know which resources can you access and act on your behalf so this one you can also learn more what means this act on your behalf and here we have this cancel and authorize the alibu demo and then you can see the small information right here authorization will redirect to which app so once I authorize this I will be automatically redirected here to the the Callback URL that I already defined all right so going back here now once I authorize I will be redirecting here but as I mentioned all this will happen in the background and here you will see that I will go back again to the client and then I will get the response because this workflow will happen in the background and I will show you again how exactly it works like I will show you what's happening or what's going on like going to the to which server to which application requesting which resources passing which ID is like the secret and the and the client that you already generated and so and so forth so I'm gonna go uh through the details of all of all of this all right now let me go back uh here so I will authorize me and you are being you saw that you are being redirected to that call and now we see that we have this hello from secure endpoint so then like what we did like you saw the the message you're being redirected so here this is that face right here and then we asked again the authorization the authorization server if this user and credentials are allowed to access this resource we got the response with the valid token and then it was sent to the back end and our backend sent back the response which is Hello from secure endpoint all right so this is how it works now I will show you in the next phase I will show you how the network works with that like which requests we are sending exactly from authorizing or like from the authentication and to authorizing the resource all right so just follow me all right now we will do the same thing again so if you want if it's not important for you for you you can skip this part but I don't recommend you skip it because I will show you how it works in the background all right so here I have again my Incognito browser because I want to show you from the login uh till the end and also here if you go to this network tab don't forget to click The Preserve log so preserve log because once we we switch from one URL to another it will clean up all all the networks and generate like log the new ones but we want to have everything together so just press the blog if you have already some Network right here you can click on this clean or clear button in order to clean everything all right so let's go again to our slash demo and as you can see here it's localhost 8080 API demo V1 all right now what we see right here let's focus on all of them all right so first of all we see that we are performing performing a call to our API or our backend and what we received is 302 and as you know the HTTP 302 is a redirection means that this call was redirected somewhere else okay and after that what happened we were redirected to this URL so and this year it's localhost 8080 and then oauth 2 slash authorization slash GitHub and from that too also we've been redirected to a different one okay and here here comes the magic or what I told you about before so first of all we've been redirected to this github.com login or auth authorization response type code because we said that let me go back to the yeah here so we said after authorizing and doing everything so here redirect to client with authorization code because here we need or like what we are searching for or what we are waiting for is an authorization code and here you can see that we have the client ID that we have in our code right here let me navigate yeah so it's the one ending with c17 like as you can see here too it's c17 and we have also the Scopes the Scopes is read user like just read because this is what we defined but like we did we did not Define anything but this is the default scope and then we have the state all right and then you can see that we have also this redirect Yuri which is localhost blah blah blah and all this all right next what we have we have this login like it's almost the same first one is authorizing and then but since the user is not logged in so also you can see that here it's 302 since the user is not logged in so as we can see here like redirect to authorization endpoint so and then it asks for authentication and we saw that within the green uh yellow or the green workflow or the green flow here like we are transmitting the authorization code and credentials and the authorization server so or like check that user is already authenticated so no need to authenticate and authorize so it was automatically redirected back to our backend all right let's move on a bit so here we have this and then this all this is just the CSS and styling and now I will just connect okay so I will click on sign in all right so uh after signing in we have this session right here and we have this authorize and this authorized as I mentioned it's the same client ID which is which ends with c17 and here like uh we have the localhost login or off and so on so forth so this is the redirect Yuri and here you can see like if you want to you can see all the information or all the tokens that are generated and sent back to our backend all right so in this case we did not see the authorize button because this user is already or or me as a user I already authorized myself to access this application so the authorization happens only once once you authorize yourself you don't need to do it anymore so this is how it works and we saw it in action we saw everything in detail and finally we can see that demo and here it's like with continue because um like we were authorized and authenticated and we can see the preview right here we have hello from secure endpoint so this is how it works next I will show you what happened or what spring provides Is Us in case we have multiple endpoints uh multiple authorization servers but before that I want to explain to you how spring is capable of identifying this and only using this client ID and client Secret how we can do all this magic because if you want to use a different authorization server or your own authorization server it's not just enough to provide this client ID and client secret you need to provide some further information now I will we will go back to the code and I will show you how spring is implementing this so now I as I mentioned I want to explain to you how all this magic happens okay the magic means like just providing some properties and the properties like the real properties that spring understands stops right here like it's Spring Security oauth to client registration and then here we can provide anything we want okay so like GitHub it can be like this it can be different name it can it can be whatever you want okay so imagine working with your own uh authorization server or like working with kick lock and so on so forth which as I mentioned before it's not by default recognized by Spring but here I'm gonna show you how the magic happens okay so it's it all starts from the palm.xml and exactly from this start right here because as you know a starter is a spring boot project and that requires the minimum configuration okay okay so if you provide everything correctly or for example if you have a starter that can do anything with auto configuration you don't need to provide anything otherwise you need to provide the minimum required and configuration of course you can override everything but this is the this is how starters works and this is why we created starters starters at the first place all right so let's close this pom.xml file and then I will make the long story short I will not go into all the details or all the classes that spring boot starter or off to client uses in order to instantiate that but I will go through some of them okay so first of all I will go to this one and here let me make this full screen so you see here that we have this oauth2 client properties and as you see it's just a property class and it's the prefix of Spring Security oauth2 client and inside that we have the registration which is a map of string and registration and this is the string right here and the map of the value of this registration also is right here okay so just follow me on that don't forget what I'm what I'm talking about here we also have a list of or a map of providers and we have some bunch of properties like the the goal here is not working through these properties but just to mention that this is how spring is mapping the properties that we provided in here within this oauth2 client properties and this all also client properties if I do command click on this you see that we have a bunch of classes that are using this properties class and one of them is this oauth2 client properties registration adapter so this registration adapter long story short is the class responsible of or the adapter responsible of registering the oauth 2 clients okay and here if we walk a bit through this method we have here our uh this is the class this is our um a Constructor and then we have this get client registrations and here we pass the auth to client properties and then like in this method right here client registration get client registration so this one it takes a bunch of parameters like the restrict the registration IDs uh also the author properties like registrations which is the property and here a list of providers and as you can see the first method that we are executing right here is called get Builder from issuer if possible this is so important like also I want to highlight this because even reading this this method name it's self-explained you don't need any documentation on that you don't need to add any extra things just build uh get Builder from issuer if possible all right so and then if we don't have the Builder we do this and that if we do we have have some information to set and as you can see here we have this map properties client ID secret authentication method we have also authorization Grant type redirect query scope and client name and remember we did not provide any of this okay but let's let's go and understand how it works so first of all if you go to this build or get Builder from Azure if possible we see here that we have a bunch of information as I mentioned you can go through this code understanding and believe me it's going to help you and from here we have some treatment so we are getting the provider we are trying to get the issuer and if the issuer is not null so here like uh from Azure location and then we have this get Builder method okay so this get Builder method it will build something all right let's go back here so from this is your location also it will try to get some information if possible all right okay so let's continue now we have this method get Builder so it takes the registration ID the provider and the list of providers and let's go check what we have in here so here we have these parameters and we have this view this line for example and then we have an object called common oauth2 provider and we have this method get common uh oauthorp provider and you see here like it will try to do some stuff but first let's go and check what is this common oauth2 provider all right so first of all as you can see it's an enam and this enam it contains a bench of values okay so here by default you can see that spring already supports Google GitHub Facebook and OCTA supports means what for example if we take GitHub right here so you see as we saw in the let me try to go back to the browser and let me show you here if we go to the headers yeah so if we go back to this to this first call here we saw that we have a scope this one right here maybe let's make it a bit bigger so you can read it better maybe zoom in here yeah so as you can see here we have the scope is read user right so this read user like it didn't came from nowhere or like but we need to set it and this reducer is already set here because here if you correctly mention GitHub as it as it's mentioned here or as it's written here by default spring will try to get this Builder Okay so uh let's go ahead so here we have the client Builder and so on so forth and now we are setting this information right here so we have the scope we have also this authorization Yuri which is login GitHub Logan oauth slash authorize and this what we saw also previously on the browser and how it works okay also this token URI and user info URI and the username attribute which is the ID and here we have the client name which is git Hub all right so it's the same for if you go for example for Google and for Google we have different Scopes so we have the open ID profile and email we have also a different authorization URI token and here we have the jwk set Yuri and this is how we can validate the tokens and so on so forth so as I mentioned here spring is providing a bunch of default implementation and default configuration for us and if you want to try that if you provide something wrong just you have two options whether rename this GitHub right here like rename the name GitHub make it like this for example or create a new registration and you will when when you start the application you will get an issue or you will get an exception because spring will not be able to build this information or to build this registration just out of these two simple information client ID and client secret and it needs more information to do that alright and more information means this just to make it simple for you all right so now we understand and we we got how spring is implementing this and how this is working now let's move on and add Google as an authorization server and let's see what changes will be happening in our application all right so I hope this was simple now let's move on so now you know how easy is to integrate any of the of the social or like the big tech companies as an oauth provider within our application so now let's go ahead and add this this one so we already generated an application using our Google accounts and also if you want to you can go ahead and generate one new thing using Facebook or also OCTA and it will work as a charm and in in another video I will explain how you can add your custom or a custom authorization server like kick log for example or even if you need to if you need or if you want to create your own authorization server all right so now let's add this Google right here so as I mentioned it's easy peasy it's a piece of cake so here at the same level of GitHub so it's gonna be Google and I will just copy paste this just in order to have the keys all right so the client ID is the one we have here so it's alibu dimu this one so let's copy this paste it in here so this is our client ID like the Google client IDs are a bit long and now we need our client secret okay so I have it somewhere here yep I'm just gonna copy it so it's all right so this is my client secret so you can use it for a moment if I don't revoke the app so I think it's going to be available for you even if you want to um if you want like to copy or to clone the the code so that's it actually this is how we can add Google also as a provider and now let's restart the application and check the changes so now after restarting the application we see that we have now two options which is GitHub and Google because we configured two options all right so let me go back to the code um like meanwhile I just changed this uh credentials so don't be surprised if you see two of them but you will be using your own credentials clear client ID and client secret so it will not be an issue for you all right so as I mentioned here we have GitHub and Google so if I choose GitHub I will be redirected to login here if I choose Google I will also be redirected and I need to provide my credentials so I can provide them right here next and then I'm redirected and also here like I'm getting notification on my mobile phone in case you have this activated so I'm just gonna authorize it so yes it's me and you will see that automatically it will redirect you to here just here the only thing is that we did not correctly configure the redirect URL but if you access again slash API slash V1 demo it will be hello from secure endpoint okay and now this is how it works as I mentioned it's like easy than ever alright thanks again for watching the video and paying really much attention to that and I hope as I promised in the beginning I hope now you have better understanding of the oauth 2.0 function out of the way it works and also how you can Implement social login within your spring boot application so if you like the video don't forget to share it with your friends also if you're new to my channel don't forget to subscribe so you can get the updates of the new videos I'm uploading each week thanks a lot for watching and see you next time

Channel: Bouali Ali

Views: 53,576

Keywords: spring, jpa, data jpa, mapping, onetoone, one to one, spring data, many to one, manytoone, class, generatedvalue, persistence, repository, service, jparepository, jpa repository, uml, class diagram, design, software, engineer, software engineer, java, jakarta, javax, spring boot, springboot, security, spring security, aliboucoding, spring boot 3.0, spring boot 3, spring 3, jwt, filter, authentication, authorization, bearer, jjwt, oauth2, github, social connect, social login

Id: 2WNjmT2z7c4

Length: 65min 27sec (3927 seconds)

Published: Tue Feb 14 2023