En esta ocasión vamos a aprovechar las capacidades de Django para crear una aplicación que valide usuarios contra algunas aplicaciones y redes sociales.
Para el caso que nos ocupa, se va a plantear una validación simple contra Google y contra Github, es decir, que cualquier usuario que tenga cuenta en Google o en Github, puede validarse como usuario en nuestra aplicación.
Para ello, vamos a contar con la ayuda de la libreria Social_Django, que nos permitirá, facilmente, esa conexión
En marcha
Como siempre, lo mejor es empezar por el principio, configurando nuestro proyecto Django:
django-admin startproject login_rrssUna vez instalado y creadas las carpetas, procedermos a la migración (en esta ocasión vamos a usar la configuración por defecto que utiliza SQLite3) y la creación del superusuario:
python manage.py migratepython manage.py createsuperuserUna vez creado y configurado lo anterior, tendremos disponible el espacio para trabajar con nuestro nueva aplicación, que podemos crear con:
python manage.py startapp login_rrssUna vez configurado y arrancado, tendremos una estructura de carpetas similar a esta:
Con la aplicación correctamente configurada, vamos a empezar con el grueso del proyecto. Instalaremos la libreria necesaria para conectarnos a diferentes redes sociales:
pip install social-auth-app-djangoY configuraremos el fichero settings.py para que funcione adecuadamente:
Añadidas las aplicaciones correspondientes, configuraremos los backends para la conexión de diferentes redes sociales, en el mismos fichero settings.py:
# PERMITIMOS LA AUTENTICACION CON REDES SOCIALES
AUTHENTICATION_BACKENDS = (
'social_core.backends.google.GoogleOAuth2',
'social_core.backends.github.GithubOAuth2',
'django.contrib.auth.backends.ModelBackend',
)
Creando las vistas
Una vez configurado lo fundamental del backend, vamos a crear unas vistas para el login, el logout y el home, que será que la página que el usuario verá cuando se conecte. El código será algo similar a esto:
// views.py
from django.shortcuts import render, redirect
from django.contrib.auth import authenticate, login, logout
def login_view(request):
if request.method == 'POST':
username = request.POST['username']
password = request.POST['password']
user = authenticate(request, username=username, password=password)
if user is not None:
login(request, user)
return redirect('home')
else:
# Manejar el caso en que las credenciales no sean válidas
pass
return render(request, 'login/login.html') # Crea este archivo HTML en el directorio templates/login_rrss/
def logout_view(request):
logout(request)
return render(request, 'login/logout.html') # Ruta actualizada
def home_view(request):
return render(request, 'login/home.html') Crearemos el fichero urls.py de login, que tendrá este contenido:
from django.urls import path,include
from . import views
urlpatterns = [
path('login/', views.login_view, name='login'),
path('logout/', views.logout_view, name='logout'),
path('home/', views.home_view, name='home'),
# Más rutas.......
M
]
Y lo incluiremos en el fichero urls.py de la aplicación principal (hay que tener en cuenta que la librería Social_Django, tiene su propia urls para las valiadaciones en las diferentes redes sociales:
from django.contrib import admin
from django.urls import path, include
from django.contrib.auth import views as auth_views
from social_django.urls import urlpatterns as social_django_urlss
urlpatterns = [
path('admin/', admin.site.urls),
path('login/', include('login.urls')),
# Url creada por el plugin social_django
path('social-auth/', include('social_django.urls', namespace='social')),
]
Creando los templates
Ahora llega el momento de crear los templates necesarios para poder trabajar con la aplicación. En este caso se han creado 3 templates muy simples: login, logout y home, usando bootstrap para que la imagen sea homegénea.
No voy a poner el código de los templates aquí, para no extender innecesariamente el post, pero podeís verlos en el repositiorio del artículo en Github.
En resumen, se crean un template para el formulario de login
Otro template para la página que aparece tras loguearse el usuario
Y un tercer template, una vez el logout ha sido realizado
Conectando con otros servicios
Llega el momento de volver al fichero settings.py para conectar con los diferentes servicios con los que queremos validar nuestro usuario.
## Validacion con Google
SOCIAL_AUTH_GOOGLE_OAUTH2_KEY = 'google_oauth2_key'
SOCIAL_AUTH_GOOGLE_OAUTH2_SECRET = 'google_oauht2_secret'
## Validación con Github
SOCIAL_AUTH_GITHUB_KEY = 'github_key'
SOCIAL_AUTH_GITHUB_SECRET = 'github_secret'
# Configuraciones de las urls donde redirigiremos al usuario en cada caso
LOGIN_URL = 'login'
LOGOUT_URL = 'logout'
LOGIN_REDIRECT_URL = '/login/home/'
LOGOUT_REDIRECT_URL = '/login/logout/'Es necesario acceder a los apartados de desarrollador de cada plataforma a la que queremos conectar, para que la configuración nos devuelva las key y secret de cada plataforma.
En el caso que nos ocupa podemos configurar una nueva apliaciación en la consola de desarrollodor de Google y en el área de desarrolladores de Github.
En ambos casos, como el resto de redes sociales, la configuración será sencilla y deberemos incluir la url de nuestro dominio y la url de redirección, que validará la conexión.
Para los casos que nos ocupan, las url de redirección, tanto de Google como de Github son: http://127.0.0.1:8000/social-auth/complete/google-oauth2/ y http://127.0.0.1:8000/social-auth/complete/github/ respectivamente.
Es necesario que compruebes en cada red social que quieras usar, cual es la url correcta, pues sin ella no funcionará la aplicación.
Una vez configurado todo esto, llega el momento de añadir a nuestra página de login, los accesos para la validación en estas redes.
Podemos usar algún tipo de icono para ilustrar el acceso o simplemente, como en este caso, un enlace con el siguiente contenido:
<!-- resto del código -->
<a href="{% url 'social:begin' 'google-oauth2' %}?next=/login/home/">Iniciar sesión con Google</a><br>
<a href="{% url 'social:begin' 'github' %}">Iniciar sesión con GitHub</a>
<!-- resto del código -->De esta forma, nuestro formulario incluirá los enlaces a estas redes:
Probando el sistema
Ahora, si seleccionamos el acceso a través de Google, nos aparecerá un dialogo para seleccionar la cuenta o cuentas que tengamos configuradas con Google:
Y una vez conectado, la página home, nos mostrará la info de la conexión:
De la misma forma, si conectamos desde Github, nos traerá los datos de la conexión que tengamos en la cuenta de github.
Notese, que como la cuenta de Github al conectar, no devuelve el correo electrónico del usuario, no lo muestra.
Los datos de usuario y las conexiones, se almacenan en las tablas que se generan automaticamente al importar Social_Django y migrar la aplicación:
Y hasta aquí el post. Como siempre digo, no son más que recetas sencillas que luego han de servir para que cada cual las ponga en práctica en su sistema y las tenga como punto de inicio.
Espero que os sea útil.
Os dejo, como siempre, el codigo del proyecto en mi cuenta de Github.