Compartir a través de

Configuración de inicio de sesión externo de Google en ASP.NET Core

  • Artículo

Por Valeriy Novytskyy, Rick Anderson y Sharaf Abacery

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

Creación del identificador de cliente y el secreto de Google OAuth 2.0

  • Siga las instrucciones de Integración de Google Sign-In en la aplicación web (documentación de Google)

  • Vaya a API y Servicios de Google.

  • Primero debe existir un proyecto , es posible que tenga que crear uno. Una vez seleccionado un proyecto, acceda al panel de control .

  • En la pantalla de consentimiento de Oauth del panel:

    • Seleccione Tipo de usuario: externo y CREAR.
    • En el cuadro de diálogo Información de la aplicación, proporcione un nombre de aplicación para la aplicación, el correo electrónico de soporte técnico del usuario y la información de contacto del desarrollador.
    • Ejecutar el paso Ámbitos.
    • Ejecutar el paso Usuarios de prueba.
    • Revise la pantalla de consentimiento de OAuth y vuelva al panel de la aplicación.

  • En la pestaña Credenciales del panel de control de la aplicación, seleccione CREATE CREDENTIALS>ID de cliente OAuth.

  • Seleccione Tipo de aplicación>aplicación web, elija un nombre de .

  • En la sección URI de redirección autorizado, seleccione AGREGAR URI para establecer el URI de redirección. URI de redirección de ejemplo: https://localhost:{PORT}/signin-google, donde el marcador de posición {PORT} es el puerto de la aplicación.

  • Seleccione el botón CREAR.

  • Guarde el Identificador de Cliente y el Secreto de Cliente para su uso en la configuración de la aplicación.

  • Al implementar el sitio, haga una de las siguientes acciones:

    • Actualice el URI de redirección de la aplicación en la consola de Google al URI de redirección implementado de la aplicación.
    • Cree un nuevo registro de API de Google en la consola de Google para la aplicación de producción con su URI de redirección de producción.

Almacenar el identificador y el secreto de cliente de Google

Almacene la configuración confidencial, como el identificador de cliente de Google y los valores secretos con Secret Manager. Para este ejemplo, siga estos pasos:

  1. Inicialice el proyecto para el almacenamiento de secretos según las instrucciones en Habilitar el almacenamiento de secretos.

  2. Almacene la configuración confidencial en el almacén de secretos local con las claves secretas Authentication:Google:ClientId y Authentication:Google:ClientSecret:

    dotnet user-secrets set "Authentication:Google:ClientId" "<client-id>"
dotnet user-secrets set "Authentication:Google:ClientSecret" "<client-secret>"

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

  • Compatible con todas las plataformas.
  • Se reemplaza automáticamente por dos puntos :.

Puede administrar las credenciales y el uso de la API en la consola de API de .

Configuración de la autenticación de Google

La llamada a AddIdentity configura los valores de esquema predeterminados. La sobrecarga de AddAuthentication(IServiceCollection, String) establece la propiedad DefaultScheme. La sobrecarga de AddAuthentication(IServiceCollection, Action<AuthenticationOptions>) permite configurar las opciones de autenticación, que se pueden usar para configurar esquemas de autenticación predeterminados con distintos fines. Las llamadas posteriores a AddAuthentication invalidan las propiedades configuradas anteriormente de AuthenticationOptions.

Los métodos de extensión AuthenticationBuilder que registran un controlador de autenticación solo pueden ser llamados una vez por esquema de autenticación. Existen sobrecargas que permiten configurar las propiedades del esquema, el nombre del esquema y el nombre para mostrar.

Inicio de sesión con Google

  • Obtenga un enlace a la biblioteca en el enlace de la biblioteca para desarrolladores de Google para obtener el enlace de la biblioteca.
  • A continuación, vaya a generación del botón para desarrolladores de Google
  • Configura tu Controlador para que coincida con el atributo data-login_uri="{HostName}/{ControllerName}/{actionName}" porque, una vez que el inicio de sesión sea exitoso, te redirigirá a ese enlace.
  • Cree un controlador y una acción que tome un argumento string credential, que Google devuelve al completar el proceso de inicio de sesión.
  • Compruebe el credential con la siguiente línea de código: GoogleJsonWebSignature.Payload payload = await GoogleJsonWebSignature.ValidateAsync(credential);
  • Esto recuperará la información disponible sobre el usuario que ha iniciado sesión, que después podría almacenarse en una base de datos.

Cambio del URI de devolución de llamada predeterminado

El segmento de URI /signin-google se establece como la devolución de llamada predeterminada del proveedor de autenticación de Google. Puede cambiar el URI de devolución de llamada predeterminado al configurar el middleware de autenticación de Google a través de la propiedad heredada RemoteAuthenticationOptions.CallbackPath de la clase de GoogleOptions.

Solución de problemas

  • Si el inicio de sesión no funciona y no recibe ningún error, cambie al modo de desarrollo para que el problema sea más fácil de depurar.
  • Si Identity no se configura llamando a services.AddIdentity en ConfigureServices, al intentar autenticarse se produce una ArgumentException: La opción "SignInScheme" debe proporcionarse. La plantilla de proyecto que se usa en este tutorial garantiza que Identity esté configurado.
  • Si no se ha creado la base de datos del sitio aplicando la migración inicial, obtendrá Error en una operación de base de datos al procesar la solicitud error. Seleccione Aplicar migraciones para crear la base de datos y actualizar la página para omitir el error y continuar.
  • Error HTTP 500 después de autenticar correctamente la solicitud por parte del proveedor de OAuth 2.0, como Google: consulte este problema de GitHub.
  • Cómo implementar la autenticación externa con Google para React y otras aplicaciones de página única: consulte este problema de GitHub.

Pasos siguientes

  • En este artículo se muestra cómo se puede autenticar con Google. Puede seguir un enfoque similar para autenticarse con otros proveedores enumerados en la página anterior .
  • Una vez que publique la aplicación en Azure, restablezca el ClientSecret en la consola de API de Google.
  • Establezca el Authentication:Google:ClientId y Authentication:Google:ClientSecret como configuración de la aplicación en Azure Portal. El sistema de configuración está configurado para leer claves de variables de entorno.