Cómo implementar autenticaciones en aplicaciones Django con Allauth

Cómo implementar autenticaciones en aplicaciones Django con Allauth

La autenticación es un proceso esencial en las aplicaciones web, que permite a los usuarios identificarse y acceder a contenido restringido. En las aplicaciones más actuales, el proceso de autenticación puede ir más allá del correo electrónico y la contraseña, como el uso de login social.

En este contexto, Allauth surge como una herramienta en el proceso de autenticación en aplicaciones Django, ofreciendo una solución robusta y flexible.


¿Qué es Allauth?


Allauth es una biblioteca de código abierto creada por Raymond Penners en 2012. Está basada en Django y sigue un proceso de autenticación simple e intuitivo. La biblioteca permite la autenticación del usuario mediante una cuenta de proveedor externo (como Google o Facebook) y facilita el registro del usuario con confirmación por correo electrónico.

Además, Allauth reutiliza de manera flexible las propias capacidades de autenticación de Django.

¿Por qué utilizar Allauth en lugar del sistema de autenticación que ya viene en Django?


El sistema de autenticación de Django es bueno y proporciona las características básicas para garantizar la seguridad del inicio de sesión, pero Allauth sirve como un impulso a lo que ya existe, dándole a la herramienta más complejidad y modernidad.

A continuación, se presentan algunas razones por las que podrías utilizar Allauth en lugar del sistema de autenticación estándar:

Autenticación social

Allauth facilita la autenticación de usuarios utilizando cuentas de proveedores externos como Google, Facebook o X. Esto puede ayudar a mejorar la experiencia del usuario al permitirles iniciar sesión fácilmente utilizando una cuenta que ya tienen en otra plataforma.

Flexibilidad

La biblioteca es configurable y se puede personalizar para satisfacer las necesidades específicas de su proyecto. Proporciona varias plantillas y formularios personalizables, así como funciones adicionales como confirmación por correo electrónico y autenticación de token.

Manejo de usuarios

Proporciona una interfaz de administración lista para usar que puede ayudar a administrar los usuarios registrados y su información de inicio de sesión. Esto puede resultar especialmente útil en proyectos donde hay muchos usuarios o cuando es necesario realizar cambios a gran escala.

Documentación y comunidad

Allauth es una biblioteca de código abierto bien documentada y mantenida activamente. Tiene una gran comunidad de usuarios y colaboradores que pueden brindar soporte y solucionar problemas.


¿Qué vamos a hacer hoy?

Para comprender cómo funciona Allauth en la práctica, crearemos un sistema de autenticación social simple.

Paso a paso para el setup de la aplicación


Proveedor externo

Antes de empezar a ensuciarnos las manos, primero configuremos un proveedor externo para permitir el inicio de sesión social. En este tutorial utilizaremos el proveedor de Google, que es bastante común en la mayoría de sitios web.

1) Haz login en la Consola de Desarrolladores de Google utilizando una cuenta de Gmail.

2) Crea un nuevo proyecto (si aún no tuvieras uno).


3) Después de crear el proyecto, activa las API y los servicios.


4) En la página Biblioteca, busca por Google+ API. Selecciona en la opción y luego haz clic en Activar (Ativar, en portugués).


5) Después de la activación, pulsa Credenciales en el botón lateral, luego en crear credenciales y, por último, en ID del Cliente OAuth. La próxima pantalla informará que primero es necesario configurar una pantalla de permiso. Para ello, haz clic en Configurar pantalla de consentimento.


6) En la pantalla de permiso, elegimos la opción externo y después Crear. Recuerda que esta configuración es de prueba. En caso de que desees conocer la funcionalidad, necesitas hacer una verificación con Google.


7) Completa la información obligatoria sobre la aplicación. Podemos dejar las opciones opcionales en blanco por ahora.

8) En el paso 3 (Usuarios de prueba), agrega la cuenta de Gmail a la que se permitirá usar la herramienta durante este período de prueba.

9) Después de la finalización, regresa al menú Credenciales, haz clic nuevamente en Crear credenciales y en ID del cliente de OAuth. Marca el tipo de aplicación como Aplicación de la Web. Puedes completar los otros apartados como en la imagen a continuación:


10) ¡Listo! Las credenciales de acceso están creadas. Puedes descargar el archivo JSON para no perderlo. Volveremos a ellas más tarde.


Instalación de Allauth en un proyecto Django


Tengamos en cuenta que ya tienes la aplicación Django configurada en tu máquina, siguiendo al menos la estructura estándar representada por el comando. djangoadmin startproject <nome-do-projeto>.


Si todo está bien, instalaremos Allauth usando el siguiente comando.


Después de instalar la dependencia, debes habilitarla dentro del proyecto modificando el archivo settings.py:

1) En INSTALLED_APPS, añade las apps django.contrib.sites, allauth, allauth.account, allauth.socialaccount y 'allauth.socialaccount.providers.google' - esta última es para habilitar el login social utilizando una cuenta de Google.


2) Debajo de INSTALLED_APPS, agrega la variable SITE_ID recibiendo el número 1.

3) En TEMPLATES, añade la ruta BASEDIR / 'templates' dentro de la clave DIRS.


4) Al final del archivo settings.py, agrega la variable AUTHENTICATION_BACKENDS, del tipo lista (array). Puedes copiar y pegar el código abajo.


5) Añade también la variable SOCIALACCOUNT_PROVIDERS. Ella recibirá especificaciones del proveedor externo que utilizaremos.


6) En el archivo urls.py, dentro del array urlpatterns, añadiremos las urls de Allauth.


7) Ahora precisamos ejecutar un comando de migrate para que el ORM de Django importe las tablas de Allauth para la base de datos (utilizaremos la base patrón sqlite).


8) Después del migrate, crea un superusuario (si aún no lo tienes).


Creando un template para la página


Dentro de la raíz del proyecto, crea la carpeta templates, la subcarpeta account y el archivo login.html. Es importante evitar errores con los nombres de las carpetas/archivos para que Allauth los lea automáticamente.

En ese archuivo se creará el template de la página de login. Puedes copiar y pegar el código html abajo o modificarlo como desees utilizando HTML y CSS.


Aún en la carpeta templates, genera una subcarpeta llamada socialaccount y un archivo login.html. También puedes utilizar el código abajo.


Probando el funcionamento de la aplicación

Ejecuta el servidor.

Nota que el servidor está funcionando en el host http://127.0.0.1:8000. Vamos a accesar la página de login a través del navegador configurado con el link http://127.0.0.1:8000/accounts/login. Allí, haz clic en Login with Google y sigue adelante.


Al final de la autenticación, la aplicación redirigirá a la url http://127.0.0.1:8000/accounts/profile/, que sería la url del perfil del usuario - pero como todavía no ha sido configurado, devolverá un 404 - Not Found (queda como tema para un futuro artículo).

De cualquier forma, es posible hacer el login de usuario a través del panel administrativo:

  1. Ingresa en http://127.0.0.1:8000/admin;
  2. Haz el login utilizando el superusuario ya creado;
  3. Selecciona Social accounts en el menú. El registro de login social estará allí, y al hacer clic en el nombre de usuario (generado automáticamente por el sistema), podrás identificar la información que Google brinda sobre el usuario.


Conclusión

Como Django tiene como lema “Baterías incluidad”, Allauth no podría ser diferente. Como podemos ver, con pocas modificaciones se logró hacer funcionar esta integración con Google. Básicamente lo que hicimos aquí fue: instalar la biblioteca, configurarla en el proyecto y sobrescribir las plantillas predeterminadas (solo por razones estéticas).

Este tutorial es sólo una pequeña muestra de lo que la biblioteca es capaz de hacer. Espero que este artículo despierte tu curiosidad por descubrir más :).

Referencias

💡
Las opiniones y comentarios emitidos en este artículo son propiedad única de su autor y no necesariamente representan el punto de vista de Listopro.

Listopro Community da la bienvenida a todas las razas, etnias, nacionalidades, credos, géneros, orientaciones, puntos de vista e ideologías, siempre y cuando promuevan la diversidad, la equidad, la inclusión y el crecimiento profesional de los profesionales en tecnología.