Secure API Gateway using Cognito Authorizer (NEW)

hello everyone today I'm going to show how to secure your API Gateway endpoint using Cognito authorizer there are two ways you can secure your endpoint in AWS One is using Lambda authorized other one using Cognito authorizer this video more focus on Cognito authorizer however if you are interesting and after the Lambda authorizer you can find the link in the description all the code uh I'm going to use in this video will be in the GitHub so as usual if you like this video and content uh please subscribe my channel really appreciate it thanks let's get in what we're gonna achieve in this video using a diagram we have a user a user is trying to access API Gateway endpoint as you can see we have a get 10 point call user behind the API Gateway there is a Lambda which is doing some work it could be business logic and business logic or it could be any uh dynamodb table or any other AWS services so far it's working but the problem here is any user in the internet they can access this get user endpoint right now time to secure our endpoint how do you do that that's a there's something called authorizer in AWS API Gateway I will show in a bit what is authorizes authorizer in the AWS console with the demo in theory there are mainly two authorizers one Lambda authorizer other one cognito authorizer what is actually authorized with the authorizer then when when the user is trying to access API Gateway the request is welded by the authorizer if the user has a necessary permission then the user can use is able to access these resources in this case it could be a dynamodb Dyno DB table or the Lambda if the the user doesn't have a necessary permission the request is terminated the user will get 403 status Response Code the Cognito authorizer is supported by the Cognito usable in this video I am going to show how do we use Cognito authorizer to secure our endpoint as I mentioned if you are after the Lambda authorizer which is the other authorizer please check a link below you can find the link to the Lambda authorizer video in summary we're going to implement concrete authorizer to secure our endpoint step by step next we're gonna check what is cognito right I'm in AWS console what I am going to do we're going to create a new API endpoint click on the API Gateway currently I do have a one already exit what I'm going to do we're going to create a new one so it shows it's come with a different API type you can choose the first one is a HTTP API as you can see it's if you want to create a builder low latency and cost effective rest API this is where you can use and it's a more likely always and the second one is a websocket if you want to keep create something like chat application keep connection between the all the all the way so where you can use web socket API the third one is rest API the one that I am going to create this is a more public that's photon is a private if you want to use this rest API within the VPC that's where you can use support one so what I'm going to do I'm going to click a third one third option uh so it's rest and select the new API or you can use something example or you can use getting from something API or you can clone any accessible API so what I'm going to do I'm gonna create a new one give it a name as a API and again the endpoints either you can select if you want to get more performance okay you can use you can use the edge optimize or if if you want to keep it in within your VPC or select the private I'm going to select the original via it's this endpoint gonna expose to public that mean internet and one can access click on create API currently yes the page is now I am in my API all the the one that I just created so under resources current we don't have any and we don't have any stages two so even for the authorizer right we will come to uh in a bit at this point so let's create a resources first so as we uh mention in the more uh beginning we're going to create a resources called users create resource and under resource what we're going to do we need to create a method in this case we're gonna create a get method uh you can choose any of the verbs but in this case we're gonna create a okay right so once you create a get so this is where you can select the integration type so when the user hit the end point API endpoint you can you can get the integrate with the Lambda function where this request goes to Lambda function and it can do some processing and return some data so either you can do a custom HTTP or you have a mock and any AWS for example you can use if you go to select the awss you can see many AWS resources are supported can we can be integrated with the API Gateway so in this case what I am going to do I'm going to create a Lambda function and the currently I don't have a Lambda function created we will come to we will create a Lambda function and give it a name here the Lambda function is a very small very simple it's just a return in the Stream that's what we're gonna do I'm gonna type Lambda and click on in the new tab currently I'll do to have a few function what I'm going to do I'm going to create new one from the scratch or you can use a different option uh let's give it name my API Lambda keep the node.js as a runtime and let the AWS to create a new role for me and click on the create function it take a few seconds because it's based on the how busy jws and the unit correction because this one need to create a role and need to attach to other function just because it seems like it's created that's good and if you go down to the code in the code tab you has been updated while you are that's fine and under the code you can see very it's a very bare minimum code it's fine because this Lambda is a very simple we don't need to worry about much we just need to return some stream that's all we need to do so other than that I am going to add the console logs um if you are trying with something demo it's better to add more logs to see what's coming what's the incoming event and what's going on so this is really helpful if you're running out with the issue and this is really helpful to uh for the troubleshooting so I'm going to deploy nothing much I just add the log which is even that's all now what we're gonna do I'm copy this name go back to my DPI Gateway and give it a name so paste the name and save it so it's asking to add the permission because this API need to talk to uh invoke the Lambda function here we just created so I am fine with that let Grant it right so the our first API endpoint is up and running so you can do some testing for example if you click on the test and if you click on this test button as you can see we get the response from the the our Lambda so if I go back and if I change the let's say API Lambda let's say API secure security API secure me let's say I'm deploying the Mind Lambda with the new change and if I go back to my API Gateway if I do a test again as you can see we get the new string which is the integration work API Gateway can talk to Lambda and it get the response right so now we do created the resources but I want to I want to expose this API Gateway endpoint the user endpoint to public or Internet currently it doesn't allow because we don't have any URL so what we can do we can deploy this end point to a different environment for example in the software development you could have a Dev Test Pro different environment so this is something again uh what we gonna do we're gonna deploy this API to new endpoint currently I don't have any stages what we're going to do we're gonna create a stages called Dev and deploy our change right so it's now you can see it's moved to Second tab which is stages and stages we do have at the same endpoint with the inbox URL so what I'm going to do I'm if I copy this is the end point which exposed to public and anyone can hit this endpoint if I click copy and if I hit so you can see uh it's working we get the rest from from the Lambda the the problem is as I mentioned this endpoint whoever have this URL can access this endpoint and they can do anything so that's the one we need to uh stop we need to secure uh unknown user to access this endpoint so if I close this again that's the time what we're gonna do we added authorizer at to secure our endpoint just quickly I want to show one of the HTTP client tool I'm gonna using in in Sonia this is pretty much same as the postman uh what we what I did I create a new request which is the same URL and if I hit send you can see we get the response this is something we're gonna use to create a token when we start applying the authorizer so keep in mind uh again you can use insonia or you can use a postman or any alternate use right I'm back in my API endpoint which is a packet which is my API my API my Dash API so I'm gonna authorize I'm click on the authorize and click on the new authorized to create a new authorizer so this is where I'm gonna secure our endpoint using the coordinator as I mentioned there are two type of authorizer one is a Lambda the other one is a Cognito we're gonna go with the Cognito if if you still after the Lambda authorizer I do have a separate video in the uh already done and please check in a description you can find the link to the Lambda authorizer so I give it a name and so here the next we need to give a usable cognitive useful so far we haven't created user pool for this uh scenario but we're gonna create a soon this is where we need to put the useful name and the token says okay let's say this is something like let's say you can give it any name let's say you can auth token so this auth token is something the users in let's say so the end user need to send a token the token name will be the odd token this is could be anything uh so in this case I have put a token but it could be any right now let's go to uh create a usable we need to create a useful uh in um and uh paste your name over here now let's go to a useful and create a new one right now let's create a cocktail adjustable I'm typing cognito open in a new tab currently I do have a one your supports what we're gonna do we're going to create a new one uh so and when you create a useful there are thousands of options you can pick here and there so I'm not going through the each uh option or properties so whenever something is special for this case I'm going to emphasize otherwise I'm going through the ammo default option so in this case I'm gonna select username and allow you set to so I need the preferred username that's fine and if you have a time like let's go with all these properties and I have a try on a joy spare time so in this case I am select the username click on the next and the password policy I am fine with the Cognito default password policy if you want you can create a new custom policy and no MFA and I'm going with the user account recovery that's fine self registration that's cool everything is pretty uh standard what I'm going to do I'm gonna click on next this is where you can see I just select the email provider I'm going with the Cognito one to uh it's a very simple one and this is email okay so when the user sign up of a new account he will get the email from this account that's email I'm gonna click next and give it a name okay this is where I'm gonna name my API pool give it a name I copied the name and go here okay hosted authentication page this is the actual user login screen the Cognito provide I'll we will see in this UI in a bit uh but you need to click on that you can use your custom or you can use the the a Cognito provide the other one is our domain I'm going with the cocktail domain now if you have a your own domain you can select your custom use a custom in this case I'm gonna use my uh the Cognito one okay so I put the name sometime name is not available you can keep changing and get something available for you uh then initial client so here we are going to create a useful when you create a useful we need to create the application so then the application and the user will get connected right so in the application in app client I'm gonna give a name my API client and keep that the classic credacities uh here so all our callback URL so in a practically what's going to happen you have an application running on your domain or your in the Local Host so what's going to happen when the users sign up when the user sign in sorry when the user sign in he put the username and password and click on the login it's it's evaluate it's validated by the Cognito and the responsive the success if the user is successful login it's redirect to your application so this is the application if it's you can give a specified name it could goes to your domain or it could go so if you're trying with the localhost you can go to the localhost so I'm gonna give a name uh it's not uh needed it's not uh something uh should be available because what we after get the token and the the some use information basically what's going to happen when the user login and it's with as I mentioned the user is successfully login it's redirect to uh this callback URL with some information authentication information like access token ID token that's something I'm I'm interesting I'll show you in a bit then you can understand why why we have put in the any fake URL call back and so I'm fine with the app settings so here in the advanced app setting client so you find with this workflow authentication workflow only uh what you need to change uh or here I didn't provider is a client useful this default select either here so what you need to do you need to select rather than code you need to select implicit Grant so if you select the code when you log in you don't get the token access token and ID token you get just a code so if you want to get the token as the access token and ID token you need to see select implicit Grant I'll show in a bit again this one everything get clear after scene so make sure you are selecting implicit Grant not the authentication code Grant and so keep it as everything as a default then I'm gonna click next uh pretty much I am in the end of the page I just enter reverse review is fine I'm gonna click create a useful it should create a is a full okay seems like it got created this is my unusual if I get into there and currently I don't have any user created but I do have a app integration and useful property there are some useful properties you can use some web to minimize some malicious calls and if I go to app integration and if I go further down and this is a hosted UI authorization customization if you want to change the logo you use some custom CSS you can use it and the one that I am interesting this app client so I'm click on the app plan and go for the down and here so this is a hosted UI this is the login screen actually login screen which shows us if I click on The View hosted UI so it's open in a new tab oh here we go we do we got a login screen are free it's come to username and password and you can log in So currently but by the way I will currently we don't have any user login user created so we will create a user and come back to this screen and try to login if I go back again and I'm go to my useful and go to users I'm creating a new user don't send any invitation that's fine I'm gonna select test one as a user no email address and the password I select a I get a secret password that's the secret password you show already right okay that's fine I'm gonna delete this user email verified otherwise it shows okay it's pending for email verification I don't need to do email edification so then click on user right we got a user user got created if I go back to my login screen and I put a name and if I put my password and click on sign in because it's the first time it's new it's asking you to change the password I put I change the password I change one letter in password I copy paste and give it a name any email is fine because you don't get an email to this email address that's fine password not match okay copy right now it's match right click on next so what's going to happen as you can see this is the URL we gave and we got something called ID token and it's give us some more information what I'm going to do I'm going to copy this stuff that's good stuff and open in yes code and I'll show you what's there right so this is the okay I got seems like I got only few what I'm going to do I'm copy whole bit copy and paste here uh right so if I go to a if I make it bigger a bit bigger so you can see we got a URL let's go back to URL and we got a ID something called ID token and it's go throughout here and we should get a access token and many more information let's get the token this one token type is VR token if I go right expire token X the token get X by in uh 360 seconds uh what I'm going to do I'm going to check next one so it should come with something called access token if I go slowly okay here we go this is one so we go to ID token and we got a we got an ID token we go to access Docker this is these are the token I'm gonna use to access our API Gateway right in a in the real world what's going to happen this URL get traded to your application and your application uh extracts SX token and ID token then it's called the API Gateway with this access token so that's how uh the in the real world it's it's working but currently I don't have a separate application this is demo this is why that's why I'm gonna use these tricks to something uh something not available right so right we got the access token and the ID token now what we gonna do we create a pool uh what we're going to do I'm gonna copy this API uh our pool the one that we created and go back to the authorizer and paste here right so we need to give a full name and calculator then token source as I mentioned it could be any but we're going to we're not gonna we're gonna click on create right the our authorizer the cognate authorizer got created right so now we got the authorizer we can do what we can do we can do a testing so click on the testing and what I am going to do I'm gonna get the ID token so basically remember we got the URL uh we are complete ID token and the access token so what I'm going to do I am copy the ID token and paste here and give a try so as you can see we got the success response 200 if I change it to let's say if I change something 3 you can download rice basically this is where you can check the your authorizer is working so in this case you need to put the ID token to test so make sure it's a ID token because when the user accessing the API get API Gateway then you need to use the access token that's why I emphasize if you test the authorizer you need to use the ID token so authorized is working what we're going to do now we need to hook this authorizer to our API Gateway API endpoint so click on the resources go to get get our endpoint and click on the method request so what we're gonna do we're gonna update the authorizer so if I click on that and this is our cognito authorizer uh Save The Tick once it's six you can see it gets some scope so over here what you need to do you need to put an email this is something we select earlier select the email and update so we hooked our authorizer to our endpoint now if someone tried to access our endpoint it should get a 403 response let's give a shot so before going to that we did some changes in resources what we need to do we need to deploy this change click on Tab and deploy so yes we got the invoked URL this is the same URL we got what I am going to do I am open Sonia and if I go here let's say I don't have anything uh let's say I'm disabled this link currently I I'm not sending any headers this is a disable it's a something like deleted I'm I'm hit this endpoint so you can see it's a five zero something five zero something ending with the 8 we see okay the same URL uh if I hit this URL what we get it's as a on unauthorized because now you can't access this endpoint because this is so now it's come with some secure endpoint uh if I if I enable this this is the odd token the one that we are mentioning if I go back to our authorizer and it says token sources so what I'm going to do I'm put the auth token and the copy the the access token and copy the access token here and paste here before pasting what I'm going to I'm I'm put one two three for example so this is a the currently uh earlier we got four zero one if I send f 1 2 3 what's going to happen let's have a look what's gonna happen still is on northrise I am put here now it's there I'm set the the access token now let's give cool we get a Hello World uh from lambdas with the second so it now it's access uh successfully access our endpoint so if I change the auth token to two we should get the author again because you need to you need to match the uh the the name the one that you mentioned in uh our authors so this is how it's working uh since uh our endpoint is working it's secure um uh through the cognito authorizer cool so quickly if I go through rundown what we have done uh basically we create a resources and we deploy to staging our Dev environment then we create the authorizer which is a concrete authorizer before creating the authorizer we need to create a user pool we create a user pool uh with the some of the default and we create a user and we create the app client and then we connect the app client with the useful and then we use her uh we got the uh auth token and the ID token uh you've seen the one that we created and then uh we used to uh use the ID token to test our authorizer and then what we did we uh hooked the authorizer into our resource over here in method request and in the authorization uh property then we deploy again we test it so that's pretty much uh the today tutorial hopefully you enjoy this video and again uh if you if you after the Lambda authorizer I do have a link below you can follow um that's pretty much for today again if you enjoyed this video uh please like And subscribe really appreciated thanks thanks and see you on next video

Channel: LoveToCode

Views: 23,979

Keywords: apigateway, secure, awstutorials, api gateway, api gateway tutorial

Id: 9crTLAT_4uY

Length: 29min 51sec (1791 seconds)

Published: Mon Mar 13 2023