ASP.NET Core 3.1 - Sign In Services

Ken Haggerty
Created 08/04/2020 - Updated 08/04/2020 03:32

This article describes how to implement ASP.NET Core Identity's external logins. I will assume you have created a new ASP.NET Core 3.1 Razor Pages project with Individual User Accounts. See Tutorial: Get started with Razor Pages in ASP.NET Core .

This article is part of the Bootstrap Native Project series.

The Bootstrap Native Project (BSNP) is deployed to preview. kenhaggerty. com. The BSNP implements Bootstrap Native and the scaffolded ASP.NET Core Identity UI with user and page enhancements. I encourage you to evaluate Account Management: Sign In Services, 2FA, and Personal Data. If you encounter an issue, I will probably be notified but please send me details in an email.

Access to the BSNP source code may be purchased on KenHaggerty.Com at Manage > Assets.

I enjoy writing these articles. It often enhances and clarifies my coding. The research project is a result of a lot of refactoring and hopefully provides logical segues for the articles. Thank you for supporting my efforts.

Associating an External Login or Sign In Service (SIS) to an existing account is not difficult. However, the scaffolded Identity UI needs modification to create a new account which has a unique, verified email address and other required properties. I have created Bootstrap Native Project sign in apps with Google, Microsoft, Facebook, Twitter, GitHub, LinkedIn, and Reddit. Login@BSNP to experience the process.

The procedures to create an OAuth app varies by provider. See MS Docs - Setup login providers required by your application. When you configure an app, the redirect URI is /signin-providername like /signin-google appended to the calling host name. All I have evaluated, allow the host name = localhost:port for testing. Some allow more than one redirect URI. The approved app will have an Id and Secret. Most use parameter names ClientId and ClientSecret. Some providers request verification and branding for approval.

Associated Services Desktop
Associated Services Mobile
Login Desktop
Login Mobile

Notice the Reddit SIS option is not available on the Register page. This is because Reddit does not share an email address. When a user attempts to create a new account with Reddit, they are redirected to the Register page with the error message.

Register Email Not Shared Desktop
Register Email Not Shared Mobile

The SIS buttons post to the Identity UI page Area/ Identity/ Pages/ Account/ ExternalLogin. cshtml which returns a ChallengeResult (An Microsoft. AspNetCore. Mvc. ActionResult that on execution invokes HttpContext. ChallengeAsync). The ChallengeResult has a redirectUrl property which handles the callback. The callback attempts to sign in with the SIS's name and key. If the SIS is not associated with an existing account, the ExternalLogin page is displayed requesting the user create a new account. The Identity UI template requires an email address to create the user. The email is used for both the username and email address. The template prompts the developer to send a verification email.

You can associate a SIS with an existing account without the SIS returning an email address. To create a new user with a SIS, the BSNP expects the SIS return an email address and considers it as verified. Most SIS return an email claim with the ExternalLoginInfo. Twitter employs an option, RetrieveUserDetails set to true, to request the user's email address. The Twitter user can authorize access without sharing their email address. Reddit does not share an email address.

If the SIS returns an email address, the BSNP displays the email address in readonly mode and requests the user to enter a username and displayed name. If an email address is not returned or already in use by another account, the user is redirected to register or login with the error message.

SIS Register Desktop
SIS Register Mobile
Login Email In Use Desktop
Login Email In Use Mobile

If you register an account with a SIS, the account is created without a password. You cannot remove the SIS until you add a second SIS or set a password. It took the deployment and quality testing of the BSNP before I trusted accounts without passwords. The forgot password email will set a new password.

Set Password Desktop
Set Password Mobile

I have installed the Authentication NuGet packages, stubbed out an Authentication section in appsettings.json and created an option to load the AddAuthentication extensions in Startup > ConfigureServices. The provider options are configured to return an email address and redirect to the Login page if the user declines provider access. All you need are the sign in apps to implement external logins.

Comment Count = 0

Please log in to comment.

Login Register
Logged in users receive web notifications.
Web Notifications