Twitter external sign-in setup with ASP.NET Core

By Valeriy Novytskyy and Rick Anderson

This sample shows how to enable users to sign in with their Twitter account using a sample ASP.NET Core 3.0 project created on the previous page.

Create the app in Twitter

  • Add the Microsoft.AspNetCore.Authentication.Twitter NuGet package to the project.

  • Navigate to https://apps.twitter.com/ and sign in. If you don't already have a Twitter account, use the Sign up now link to create one.

  • Select Create an app. Fill out the App name, Application description and public Website URI (this can be temporary until you register the domain name):

  • Check the box next to Enable Sign in with Twitter

  • Microsoft.AspNetCore.Identity requires users to have an email address by default. Go to the Permissions tab, click the Edit button and check the box next to Request email address from users.

  • Enter your development URI with /signin-twitter appended into the Callback URLs field (for example: https://webapp128.azurewebsites.net/signin-twitter). The Twitter authentication scheme configured later in this sample will automatically handle requests at /signin-twitter route to implement the OAuth flow.

    Note

    The URI segment /signin-twitter is set as the default callback of the Twitter authentication provider. You can change the default callback URI while configuring the Twitter authentication middleware via the inherited RemoteAuthenticationOptions.CallbackPath property of the TwitterOptions class.

  • Fill out the rest of the form and select Create. New application details are displayed:

Store the Twitter consumer API key and secret

Store sensitive settings such as the Twitter consumer API key and secret with Secret Manager. For this sample, use the following steps:

  1. Initialize the project for secret storage per the instructions at Enable secret storage.

  2. Store the sensitive settings in the local secret store with the secrets keys Authentication:Twitter:ConsumerKey and Authentication:Twitter:ConsumerSecret:

    dotnet user-secrets set "Authentication:Twitter:ConsumerAPIKey" "<consumer-api-key>"
dotnet user-secrets set "Authentication:Twitter:ConsumerSecret" "<consumer-secret>"

The : separator doesn't work with environment variable hierarchical keys on all platforms. __, the double underscore, is:

  • Supported by all platforms. For example, the : separator is not supported by Bash, but __ is.
  • Automatically replaced by a :

These tokens can be found on the Keys and Access Tokens tab after creating a new Twitter application:

Configure Twitter Authentication

Add the Twitter service in the ConfigureServices method in Startup.cs file:

{
    services.AddDbContext<ApplicationDbContext>(options =>
        options.UseSqlServer(
            Configuration.GetConnectionString("DefaultConnection")));
    services.AddDefaultIdentity<IdentityUser>(options =>
        options.SignIn.RequireConfirmedAccount = true)
            .AddEntityFrameworkStores<ApplicationDbContext>();
    services.AddRazorPages();

    services.AddAuthentication().AddTwitter(twitterOptions =>
    {
        twitterOptions.ConsumerKey = Configuration["Authentication:Twitter:ConsumerAPIKey"];
        twitterOptions.ConsumerSecret = Configuration["Authentication:Twitter:ConsumerSecret"];
        twitterOptions.RetrieveUserDetails = true;
    });

}

The AddAuthentication(String) overload sets the DefaultScheme property. The AddAuthentication(Action<AuthenticationOptions>) overload allows configuring authentication options, which can be used to set up default authentication schemes for different purposes. Subsequent calls to AddAuthentication override previously configured AuthenticationOptions properties.

AuthenticationBuilder extension methods that register an authentication handler may only be called once per authentication scheme. Overloads exist that allow configuring the scheme properties, scheme name, and display name.

Multiple authentication providers

When the app requires multiple providers, chain the provider extension methods behind AddAuthentication:

services.AddAuthentication()
    .AddMicrosoftAccount(microsoftOptions => { ... })
    .AddGoogle(googleOptions => { ... })
    .AddTwitter(twitterOptions => { ... })
    .AddFacebook(facebookOptions => { ... });

See the TwitterOptions API reference for more information on configuration options supported by Twitter authentication. This can be used to request different information about the user.

Sign in with Twitter

Run the app and select Log in. An option to sign in with Twitter appears:

Clicking on Twitter redirects to Twitter for authentication:

After entering your Twitter credentials, you are redirected back to the web site where you can set your email.

You are now logged in using your Twitter credentials:

Forward request information with a proxy or load balancer

If the app is deployed behind a proxy server or load balancer, some of the original request information might be forwarded to the app in request headers. This information usually includes the secure request scheme (https), host, and client IP address. Apps don't automatically read these request headers to discover and use the original request information.

The scheme is used in link generation that affects the authentication flow with external providers. Losing the secure scheme (https) results in the app generating incorrect insecure redirect URLs.

Use Forwarded Headers Middleware to make the original request information available to the app for request processing.

For more information, see Configure ASP.NET Core to work with proxy servers and load balancers.

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 sample ensures that this is done.
  • If the site database has not been created by applying the initial migration, you will get A database operation failed while processing the request error. Tap Apply Migrations to create the database and refresh to continue past the error.

Next steps

  • This article showed how you can authenticate with Twitter. 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 ConsumerSecret in the Twitter developer portal.

  • Set the Authentication:Twitter:ConsumerKey and Authentication:Twitter:ConsumerSecret as application settings in the Azure portal. The configuration system is set up to read keys from environment variables.