Comparte en Facebook Twitter Google+

GitHub con Laravel Socialite

GitHub es una plataforma utilizada por una gran cantidad de desarrolladores hoy en día, aunque sea de forma casual. Así que si estás pensando crear una aplicación solo para desarrolladores, podrías considerar agregar autenticación mediante GitHub como una alternativa a la autenticación tradicional de usuario y contraseña que incluye Laravel por defecto. Quizás suena complicado integrar una autenticación de terceros en tu aplicación, pero en realidad el componente Laravel Socialite lo hace muy sencillo, como veremos en el siguiente tutorial:

Para poner a prueba el componente Laravel Socialite, necesitaremos por supuesto un proyecto de Laravel, yo crearé uno nuevo desde la consola con el comando laravel new hub (siendo hub el nombre que voy a darle al proyecto). Por otro lado la URL de este proyecto será http://hub.app/

Instalando Laravel Socialite

composer require laravel/socialite

Ahora típicamente agregaríamos el Service Provider en nuestro archivo config/app.php, pero Laravel 5.5 incluye una nueva característica de detección automática de paquetes que hace este paso opcional, de igual forma el alias del Facade Socialite será agregado automáticamente. Puedes darte cuenta de esto porque al instalar el componente deberías ver un mensaje como el siguiente en la consola:

Discovered Package: laravel/socialite

Agregando nuestras credenciales de GitHub

Lo siguiente que debemos hacer es agregar nuestras credenciales de GitHub en config/services.php de la siguiente forma:

Pero en vez de almacenar los valores de GitHub como cadenas en el archivo de configuración, voy a utilizar mi archivo de entorno para ello, por medidas de seguridad:

Para obtener estos dos valores debes ir ahora a tu cuenta de GitHub, buscar en:

  1. Settings
  2. Developer Settings
  3. OAuth Apps
  4. Register a new application
  5. Colocar los datos de tu nueva aplicación:
    • Asegúrate de colocar en “Authorization callback URL” la misma URL que colocaste en redirect (en mi caso: http://hub.app/login/callback).
  6. Presiona “Register Application”

Luego copia y pega el ID y el Secret generados al final del archivo .env de tu aplicación, de esta forma.

Nota que yo estoy asignándolos a las variables de entorno GITHUB_ID y GITHUB_SECRET, tú puedes colocarles los nombres que quieras siempre que coincidan con los que colocaste en config/services.php y que por favor mantengas estos valores excluidos del repositorio del proyecto. Aprende más sobre variables de entorno y sobre seguridad en Laravel.

Como redirect es una simple URL puedes dejarla en services.php o colocarla también como variable de entorno si quieres.

Utilizando Laravel Socialite

Ahora estamos listos para poner a prueba este componente. Primero creemos un nuevo controlador:

php artisan make:controller LoginController

Luego en el controlador escribiremos el siguiente código:

Por supuesto debemos registrar las rutas en el archivo routes/web.php:

Ahora cuando visito http://hub.app/login soy llevado a GitHub y luego de otorgar autorización, soy llevado de vuelta a mi app donde veo en pantalla el mensaje Bienvenido Duilio Palacios (sileence)

Por supuesto nosotros no queremos limitarnos a obtener información, sino que queremos autenticar a nuestro usuario y ¡En este punto ya podemos hacerlo! Puesto que hemos comprobado su identidad a través de GitHub. Así que vamos a actualizar el método handleGitHubCallback con lo siguiente:

Ahora, utilizando Eloquent, le indicamos a Laravel que queremos obtener o crear un usuario con el email obtenido desde GitHub (si el email ya existe en la tabla users vamos a traer al usuario, de lo contrario crearemos un usuario nuevo con dicho email más los datos extras que pasamos como segundo argumento (nickname, etc). De cualquier forma firstOrCreate nos devolverá un objeto de tipo User que representará al usuario de nuestra aplicación y en mi ejemplo lo estoy almacenando en una variable $appUser.

Estoy utilizando las variables $githubUser y $appUser para que puedas visualizar que son 2 objetos diferentes, el primero proviene de Socialite y contiene la información de GitHub y el último será solo un modelo de Eloquent como ya hemos trabajado antes.

Una vez obtenido o creado el usuario, lo vamos a autenticar con auth()->login($appUser) y finalmente debemos hacer una redirección a otra página, en mi ejemplo, a la página de inicio y también envié un mensaje de alerta que puedes imprimir en la vista simplemente con:

Si quieres probar el código anterior, por supuesto necesitarás crear una base de datos, configurarla en el archivo .env y además modificar la migración de usuarios para agregar los campos extras:

Es importante que elimines el campo password (en el caso de que solo quieras soportar autenticación mediante GitHub).

También debes modificar la propiedad $fillable dentro del modelo User (en app/User.php), para agregar las columnas adicionales:

Una vez hecho esto, sólo tienes que ejecutar las migraciones con php artisan migrate y ¡Ya estás listo para probar el nuevo login!

Conclusión

Como puedes ver, Laravel Socialite hace que sea muy fácil aprovechar el sistema de autenticación de otras plataformas como GitHub, para no solo identificar al usuario, sino también obtener información básica que podemos almacenar en la base de datos de nuestra aplicación, haciendo el proceso de registro básico muy sencillo, rápido y sin formularios. La única desventaja acá es que obligaríamos a nuestros usuarios a tener cuenta de GitHub, lo cual puede ser un problema o no. Para solucionar esto, podemos ofrecer otras vías de autenticación (por ejemplo mediante Facebook con Socialite) o seguir soportando el sistema tradicional de usuario + contraseña. De cualquier forma con esta introducción espero que puedas sacarle provecho a este componente de Laravel. No dejes de revisar la documentación de Socialite para ver todas las opciones disponibles.

Si quieres aprender más sobre autenticación con Laravel, regístrate en nuestro listado de emails y te informaré de nuevos tutoriales:

Suscríbete a nuestro boletín

Te enviaremos publicaciones con consejos útiles y múltiples recursos para que sigas aprendiendo.

Regístrate hoy en Styde y continua mejorando tus habilidades: ver planes.