Facebook external login setup in ASP.NET Core

By Valeriy Novytskyy and Rick Anderson

This tutorial with code examples shows how to enable your users to sign in with their Facebook account using a sample ASP.NET Core project created on the previous page.

Create the app in Facebook

Add the Microsoft.AspNetCore.Authentication.Facebook NuGet package to the project.
Follow the Facebook App Registration instructions to create a Facebook app and obtain your App ID and App Secret.
Follow the Facebook Login for Web instructions to configure Facebook Login for your app. Add your development URI with /signin-facebook appended (for example: https://localhost:44320/signin-facebook) to the Valid OAuth Redirect URIs.

The Facebook authentication configured later in this tutorial automatically handles requests at the /signin-facebook route to implement the OAuth flow.

[!NOTE] The URI /signin-facebook is set as the default callback of the Facebook authentication provider. You can change the default callback URI while configuring the Facebook authentication middleware via the inherited xref:Microsoft.AspNetCore.Authentication.RemoteAuthenticationOptions.CallbackPath%2A?displayProperty=nameWithType property of the xref:Microsoft.AspNetCore.Authentication.Facebook.FacebookOptions class.

Follow the Facebook Login Permissions guide to enable the email permission for your app. The ASP.NET Core Facebook authentication middleware requests the email scope by default. If the email permission isn't enabled on your Facebook app, authentication may fail or the user's email address will be missing after sign-in.
Make a note of your App ID and App Secret. You add both into your ASP.NET Core application in the next section.
When deploying the site, revisit the Facebook Login setup page and register a new public URI.

Store the Facebook app ID and secret

Store sensitive settings such as the Facebook app ID and secret values with Secret Manager. For this sample, use the following steps:

Initialize the project for secret storage per the instructions at Enable secret storage.
Store the sensitive settings in the local secret store with the secret keys Authentication:Facebook:AppId and Authentication:Facebook:AppSecret:
dotnetcli
```
dotnet user-secrets set "Authentication:Facebook:AppId" "<app-id>"
dotnet user-secrets set "Authentication:Facebook:AppSecret" "<app-secret>"
```

[!INCLUDE]

Configure Facebook Authentication

:::moniker range="< aspnetcore-6.0"

Add the Authentication service to the Startup.ConfigureServices:

csharp

services.AddAuthentication().AddFacebook(facebookOptions =>
{
    facebookOptions.AppId = Configuration["Authentication:Facebook:AppId"];
    facebookOptions.AppSecret = Configuration["Authentication:Facebook:AppSecret"];
});

:::moniker-end

:::moniker range=">= aspnetcore-6.0"

Add the Authentication service to the Program:

[!code-csharp]

:::moniker-end

[!INCLUDE default settings configuration]

Run the app and select Log in.
Under Use another service to log in., select Facebook.
You are redirected to Facebook for authentication.
Enter your Facebook credentials.
You are redirected back to your site where you can set your email.

You are now logged in using your Facebook credentials.

xref:Microsoft.AspNetCore.Authentication.RemoteAuthenticationOptions.AccessDeniedPath can provide a redirect path to the user agent when the user doesn't approve the requested authorization demand.

The following code sets the AccessDeniedPath to "/AccessDeniedPathInfo":

[!code-csharp]

We recommend the AccessDeniedPath page contains the following information:

Remote authentication was canceled.
This app requires authentication.
To try sign-in again, select the Login link.

Test AccessDeniedPath

Navigate to facebook.com
If you are signed in, you must sign out.
Run the app and select Facebook sign-in.
Select Not now. You are redirected to the specified AccessDeniedPath page.

[!INCLUDEForward request information when behind a proxy or load balancer section]

For more information on configuration options supported by Facebook authentication, see the xref:Microsoft.AspNetCore.Builder.FacebookOptions API reference. Configuration options can be used to:

Request different information about the user.
Add query string arguments to customize the login experience.

Troubleshooting

ASP.NET Core 2.x only: If Identity isn't configured by calling services.AddIdentity in ConfigureServices, attempting to authenticate will result in ArgumentException: The 'SignInScheme' option must be provided. The project template used in this tutorial ensures that this is done.
If the site database has not been created by applying the initial migration, you get A database operation failed while processing the request error. Tap Apply Migrations to create the database and refresh to continue past the error.
If you receive an error during Facebook sign-in or the user's email address is missing after sign-in, verify that the email permission is enabled for your Facebook app. See the Facebook Login Permissions guide for details on enabling permissions in the Facebook Developer portal.

Next steps

This article showed how you can authenticate with Facebook. You can follow a similar approach to authenticate with other providers listed on the previous page.
Once you publish your web site to Azure web app, you should reset the AppSecret in the Facebook developer portal.
Set the Authentication:Facebook:AppId and Authentication:Facebook:AppSecret as application settings in the Azure portal. The configuration system is set up to read keys from environment variables.

Additional resources

Multiple authentication providers