this is part seventy of asp.net core tutorial in this video we'll discuss implementing login functionality in asp.net Co using the identity API to implement the login functionality we need three things login view model they login view itself and then a pair of login actions a login action that responds to HTTP cat and displays the login view to the user and then another login action that responds to HTTP POST when the login view is submitted by clicking the login button we create these to login actions within the account controller our first step is to create the login view model to be able to login a user we need three pieces of information in our example we're using email as the username so within the login view model we need a property for email notice we are using required and email address attributes on the email property for model validation we discussed model validation in detail in our previous videos in the series to be able to log in a user in addition to their email which in our case is the username we also need their password and remember me boolean property as the name implies this boolean property is for the remember me checkbox that we see on the login page of most web applications if the checkbox is checked then we create a persistent cookie otherwise we create a session cookie will discuss the difference in just a bit but before that let's create this vlog in view model class with these three properties let's place login view model in this view models folder right click add new item we want to add a class and let's name it login view model inside this class we need the three properties email password and remember me that we have seen on this slide just now there's nothing new with this view model class we already discussed new models in detail in our previous videos in this series so in the interest of time I'm going to pace the required code instead of typing everything by hand we are missing the required a namespace for these validation attributes that's the reason we see all these red squiggly lines let's bring in the required data annotations namespace by pressing control period our next step is to create the login view itself and for the login view this class login view model will be the model and we want to place the login view in the account subfolder in the views folder so right click add new item we want to add a laser view and let's name it login the model for this view is of a login view model next let's set the page title using view bag the property that we'll use is title and let's set it to user login using an h1 element let's display the text user login on the page finally we need a CH tml input elements for email password and remember me checkbox again there's nothing new in this login view that we haven't discussed in our previous videos in the series so in the interest of time I'm going to place the required HTML and walk you through it we are using bootstrap for to style this login view so all these styling classes row column d12 text danger form group or bootstrap for classes when this form is submitted we want to issue a post request to login the user so we have said the form element method attribute to post to display any validation errors we might have there using the validation summary tag helper and then inside this tail we have three elements to capture user email we have a label and input element and then the validation tag helper for email and the same is true for password we have a label input element and then validation ter Kalpa and then finally to get the remember me checkbox we have a label and then we are using an input element along with the HTML helper display name for and then finally the submit button the text on the submit button is login when this button is clicked the login view is submitted to the server using a post request so our next step is to include a pair of login actions within our account controller notice the register action we've got a pair of methods the first one here responds to HTTP GET whereas this one responds to HTTP POST we want to do the same thing for the login action that's actually make a copy of these two action methods and then change the bits that are required when I get request is issued to slash account slash login this is the action method that we want to execute so let's change the name of the action to login as you can see all this method is doing is returning a view which view is it going to return since the name of the action method is login by default it's going to return this login view after we filled this view with the required data and submit this form to the server we want this action method to handle that post request so the first thing that we want to do is change the action by the name to login this method is going to receive login view model as a parameter because if we take a look at of a login view the model is login view model so when this view is submitted this method receives login view model instead of register view model if the model state is valid we want to sign the user in we don't need to create a new identity user object so let's get rid of this code first to sign-in and sign-out a user we use sign-in manager instead of user manager silent manager is already injected into this controller using constructor injection right here so let's use the injected service to sign in the user so instead of user manager here let's use sign-in manager on this silent manager service instance we have password sign-in async method which we use to sign the user in there are two overloads of this method we're going to use the second overloaded version which takes four parameters the first one is the username we get the user name from the email property of our model object because in our case email is the username and then the password again we have password property on the model object the third parameter is a boolean parameter is persistent we use this parameter to specify if we want to create a session cookie or a persistent cookie the value for this parameter comes from remember me property on the model object we use the final parameter to specify if we want to lock the account on failure we'll discus account lockouts in our upcoming videos in the series for now let's set it to false now notice from the intellisense this password sign in async method returns sign and result object and we are showing that in this variable and that object has caught this boolean property succeeded which is set to true if the sign-in is successful so if we have successfully signed in the user we want to redirect him to the index section of our home controller we don't need this line of code anymore so let's delete that if this succeeded property is false that means the provided username password combination is invalid and we want to display that error to the user for that let's add it to the model state using ad model error method the key is an empty string and the error message is invalid login attempt this for each loop is not required so let's delete that if the model state is valid we try to sign the user end if sign-in is successful we redirect the user to the index section of the home controller if the sign-in attempt is unsuccessful will display this message invalid login attempt if the model state is not valid we rear-ended the login view and the user get to see the validation errors so with all these changes in place let's run our project now let's click on this login link notice we navigate to slash account slash login and we see our login view now if I try to login without providing a value for email and password we see required validation errors let's provide a valid email but an invalid password notice we see the error invalid login attempt now let's provide a valid password notice we are signed in and we see this logout link when I click on the logout link we are logged out and see the register and login links instead of the logout link now let's understand the primary difference between a session cookie and a persistent cookie for that first let's launch browser developer tools at the moment I am on the application tab and looking at the cookies section right now we only have one cookie and that is the asp.net core and I forgery cookie well discuss the significance of this cookie in our upcoming videos in this series now let's try to log in notice I have not checked this remember me checkbox and then try to log in in this case it's actually creating a session cookie notice this second cookie that just appeared it's been at Chordata identity dot application this is the login cookie when we submitted our username and password to the server the server validated the username password combination and logged us in to indicate that we are logged in this cookie is issued by the server to the browser so every time now this and a new request by clicking on these navigation links or the buttons within the pages of our application this cookie is sent with each request to the server this cookie is then used by the server to know that they are already authenticated and logged in this cookie can either be a session cookie or a persistent cookie depending on whether they remember me checkbox is checked or not we just logged in without selecting remember me checkbox so the cookie that we have right here is a session cookie and a session cookies immediately lost if we close the browser window and if this cookie is not present in the subsequent requests that we sent to the server the server will not know that we are logged in let's actually prove this so when I close this browser we are going to lose this cookie let me relaunch the browser and navigate to our application let's also launch the browser developer tools so we know what's going on notice a login cookie is gone and as a result the server does not know that we are already logged in and because of that we see these two links register and login instead of the logout link now let's try to log in again this time let's select this checkbox remember me we are logged in notice the link here it change it to logout we also have our login cookie created this time we have a persistent cookie a permanent cookie this means even when I close this browser window we are not going to lose this cookie because this is now saved to my machine so when I real aunch the browser window and issue a request to our application it's going to send this login cookie automatically with that request so the server knows we are logged in and it's going to display this logout link instead of register and login let's actually prove this it may close the browser window relaunch the browser and let's navigate to our application URL let's also launch browser developer tools notice I still have our login cookie a spin at co dot identity dot application and because this cookie is present the server knows we are logged in and we see the logout link here so the main difference is a session cookie is permanently deleted when the browser window is closed on the other hand a persistent cookie is not deleted when the browser window is closed if you want the persistent cookie to be immediately deleted simply log out of the application when I click on this logout link this login cookie will be immediately removed irrespective of whether it's a persistent cookie or a session cookie look at this when I click the logout link notice the login cookies immediately deleted we are logged out of the application and we see the register and login links instead of the logout link here is the login view code and then they do login actions that's it in this video thank you for listening [Music]