In this video, add the UX and controllers to an ASPNET MVC application that allow the user to sign and sign out.
- [Instructor] Now, in the next step, we wish to add a user interface. Maybe we want to tell the user what user ID they're logged in as, or if they're not logged in, we want to show a sign in, sign out part, you have something like that. How do we go about doing that? Well, let's see. In our project structure here, let's go to the views area. So, what I'm going to do now, is that under shared, I'm going to add a partial view. And that partial view's responsibility will be to show things like sign in, sign out.
Obviously, we need to have a controller behind the scenes for it, too. And then, I will reference that partial view in this Layout.cshtml file. So, let me first start by adding a new partial view. Which I right click on new view, and let's call this LoginPartial. Create as a partial view and click on add. So, in here, I'm going to go ahead and add some code and let me explain what this code does.
It's actually very simple. We simply say, if the request is already authenticated, then we want to tell the user who they are, and we want to give them a sign out link. Now, this action link, you know it's backed by a controller, we haven't written that controller yet. We'll write that shortly. And if the user is not signed in, then we want to go ahead and give the user a sign in button. Again we need to write the controller and the appropriate action method here.
We'll do that shortly. But while we're on the topic of views, let me also go ahead and reference this LoginPartial from Layout.cshtml. Let's dive into Layout.cshtml, and I'll go ahead and reference this partial view using Html.Partial underscore LoginPartial. Effectively, this makes LoginPartial a part of our user interface. Excellent.
Next, we need to add that controller I talked about. So, let's go into controllers, and here let's go ahead and add a new controller. And let's call this the MVC controller. Click add, and let's call this AccountController. These names have to match what you specified in the view, so be careful that you make sure that these names match when you're following along as well. Not only does this name have to match, the actions that you call from your LoginPartial, notice it's called account and sign in, account and sign out.
So, I need to have an AccountController with two methods in here. One called sign in, another called sign out. Again, be careful that these names must match. So, let's get rid of this default action that we had. We won't be needing that. And let's go ahead and add a public void SignIn. Again, be careful that these names have to match. And here, I'm going to say if Request is not authenticated, then HttpContext.GetOwinContext.Authentication.Challenge.
Right, so the Owin auth makes this almost too easy for us. New AuthenticationProperties, to actually, to make the code a little bit more readable, I'm going to add a using for Microsoft.Owin.Security at the top. (keyboard clicks) While we're at it, also let's go in and add Microsoft.Owin.Security.Cookies and OpenIdConnect.
Come back to where we were. So, we're specifying AuthenticationProperties. So, we need to specify things like RedirectUri. So, after you sign in, where do we go? So, in our case RedirectUri will be the root of the application. And then what kind of authentication type do we want to use? I'm going to say OpenIdConnectAuthenticationDefaults.AuthenticationType. That's it. This finishes my sign in code. Now, let's talk about sign out.
Sign out couldn't be any simpler. So, I'm going to say public void SignOut. Again, these names, it is very critical that you match them. And here I'm going to simply say, let's just copy paste this. (mouse clicking) And instead of Challenge, I'm going to say SignOut.
And here we don't need a RedirectUri. And since we are back with cookies, I'm going to say CookieAuthenticationDefaults.AuthenticationType. And that finishes my application. So, just a quick recap of what we did. First, we registered the application in Azure AD. We created an MVC application, added a bunch of NuGet packages. We changed it to use as a cell.
We got the values from our Azure AD registration, and we put them in Web.config. We added authentication logic and Startup.cs. And then we added some user interface to allow us to sign in and sign out.
- What is Microsoft Graph?
- Registering a web application in Azure AD
- Adding authentication logic and authentication UI
- Native applications calling Graph
- Reviewing scenarios where web apps involving Graph are useful
- Web applications with application identity and delegated identity calling Graph
- Daemons calling Graph