Configuración de inicio de sesión externo de Twitter con ASP.NET Core

Artículo
05/13/2021
2 minutos para leer

En este ejemplo se muestra cómo permitir que los usuarios inicien sesión con su cuenta de Twitter mediante un proyecto de ejemplo ASP.NET Core 3.0 creado en la página anterior.

Creación de la aplicación en Twitter

Agregue el paquete NuGet Microsoft.AspNetCore.Authentication.Twitter al proyecto.
Vaya a https://apps.twitter.com/ e inicie sesión. Si aún no tiene una cuenta de Twitter, use el vínculo Registrarse ahora para crear una.
Seleccione Crear una aplicación. Rellene el nombre de la aplicación, la descripción de la aplicación y el URI del sitio web público (esto puede ser temporal hasta que registre el nombre de dominio):
Active la casilla situada junto a Habilitar inicio de sesión con Twitter.
Microsoft.AspNetCore.Identity requiere que los usuarios tengan una dirección de correo electrónico de forma predeterminada. Vaya a la pestaña Permisos, haga clic en el botón Editar y active la casilla situada junto a Solicitar dirección de correo electrónico a los usuarios.
Escriba el URI de desarrollo con /signin-twitter anexado al campo Direcciones URL de devolución de llamada (por ejemplo: https://webapp128.azurewebsites.net/signin-twitter ). El esquema de autenticación de Twitter configurado más adelante en este ejemplo controlará automáticamente las solicitudes en /signin-twitter la ruta para implementar el flujo de OAuth.

Nota

El segmento URI /signin-twitter se establece como la devolución de llamada predeterminada del proveedor de autenticación de Twitter. Puede cambiar el URI de devolución de llamada predeterminado al configurar el middleware de autenticación de Twitter a través de la propiedad RemoteAuthenticationOptions.CallbackPath heredada de la clase TwitterOptions.
Rellene el resto del formulario y seleccione Crear. Se muestran los detalles de la nueva aplicación:

Almacenamiento de la clave y el secreto de la API de consumidor de Twitter

Almacene la configuración confidencial, como la clave y el secreto de la API de consumidor de Twitter con Secret Manager. Para este ejemplo, siga estos pasos:

Inicialice el proyecto para el almacenamiento de secretos según las instrucciones de Habilitación del almacenamiento de secretos.
Almacene la configuración confidencial en el almacén de secretos local con las claves de Authentication:Twitter:ConsumerKey secretos y Authentication:Twitter:ConsumerSecret :
```
dotnet user-secrets set "Authentication:Twitter:ConsumerAPIKey" "<consumer-api-key>"
dotnet user-secrets set "Authentication:Twitter:ConsumerSecret" "<consumer-secret>"
```

El separador : no funciona con claves jerárquicas de variables de entorno en todas las plataformas. __, el carácter de subrayado doble, tiene las siguientes características:

Es compatible con todas las plataformas. Por ejemplo, el separador : no es compatible con Bash, pero __ sí.
Se reemplaza automáticamente por un signo :.

Estos tokens se pueden encontrar en la pestaña Claves y tokens de acceso después de crear una nueva aplicación de Twitter:

Configuración de la autenticación de Twitter

Agregue el servicio twitter en el ConfigureServices método en el archivo Startup.cs:

{
    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;
    });

}

La sobrecarga AddAuthentication (String) establece la propiedad DefaultScheme . La sobrecarga AddAuthentication (Action<AuthenticationOptions>) permite configurar las opciones de autenticación, que se pueden usar para configurar esquemas de autenticación predeterminados para propósitos diferentes. Las llamadas subsiguientes a AddAuthentication invalidan las propiedades de AuthenticationOptions configuradas previamente.

Solo se puede llamar una vez a los métodos de extensión AuthenticationBuilder que registran un controlador de autenticación una vez por esquema de autenticación. Existen sobrecargas que permiten configurar las propiedades de esquema, el nombre de esquema y el nombre para mostrar.

Varios proveedores de autenticación

Cuando la aplicación requiera varios proveedores, encadene los métodos de extensión del proveedor detrás de AddAuthentication:

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

Consulte la referencia de la API TwitterOptions para obtener más información sobre las opciones de configuración compatibles con la autenticación de Twitter. Se puede usar para solicitar información diferente sobre el usuario.

Ejecute la aplicación y seleccione Iniciar sesión. Aparece una opción para iniciar sesión con Twitter:

Al hacer clic en Twitter, se redirige a Twitter para la autenticación:

Después de escribir las credenciales de Twitter, se le redirigirá de nuevo al sitio web donde puede establecer el correo electrónico.

Ahora ha iniciado sesión con sus credenciales de Twitter:

Reenvío de información de solicitud con un servidor proxy o un equilibrador de carga

Si la aplicación se implementa detrás de un servidor proxy o de un equilibrador de carga, parte de la información de solicitud original podría reenviarse a la aplicación en los encabezados de solicitud. Normalmente, esta información incluye el esquema de solicitud seguro (https), el host y la dirección IP del cliente. Las aplicaciones no leen automáticamente estos encabezados de solicitud para detectar y usar la información de solicitud original.

El esquema se usa en la generación de vínculos que afecta al flujo de autenticación con proveedores externos. El resultado de perder el esquema seguro (https) es que la aplicación genera direcciones URL incorrectas poco seguras.

Use middleware de encabezados reenviados para que la información de solicitud original esté disponible para la aplicación para procesar las solicitudes.

Para obtener más información, consulta Configuración de ASP.NET Core para trabajar con servidores proxy y equilibradores de carga.

Solucionar problemas

ASP.NET Core 2.x: Si no se configura mediante una llamada a en , el intento de autenticación dará como resultado ArgumentException: se debe proporcionar la opción Identity services.AddIdentity ConfigureServices "SignInScheme". La plantilla de proyecto usada en este ejemplo garantiza que esto se realiza.
Si la base de datos del sitio no se ha creado aplicando la migración inicial, se producirá un error en una operación de base de datos al procesar el error de solicitud. Pulse Aplicar migraciones para crear la base de datos y actualizarla para continuar después del error.

Pasos siguientes

En este artículo se ha mostrado cómo puede autenticarse con Twitter. Puede seguir un enfoque similar para autenticarse con otros proveedores enumerados en la página anterior.
Una vez publicado el sitio web en la aplicación web de Azure, debe restablecer en ConsumerSecret el portal para desarrolladores de Twitter.
Establezca y Authentication:Twitter:ConsumerKey como configuración de la aplicación en el Authentication:Twitter:ConsumerSecret Azure Portal. El sistema de configuración está configurado para leer claves de variables de entorno.