This post is also available in: English

Aplicaciones móviles y SPA (Aplicaciones de una sola página) son clientes muy comunes para la mayoría de los productos de software modernos. Normalmente recuperan datos de algún servicio API RESTful y muestran esos datos al usuario. Aunque las API RESTful ofrecen una forma sencilla de crear sistemas flexibles y escalables, a menudo querrá proteger los datos de usuarios no autenticados. Una forma común de hacer esto es mediante el uso de JWT. En este tutorial, vamos a repasar la adición de autenticación JWT a Laravel. Puede encontrar el proyecto GitHub aquí y los cursos de video relacionados aquí.

Configuración del proyecto

Una de las primeras cosas que debemos hacer es crear un nuevo proyecto Laravel. Ejecute el siguiente comando en su terminal.

laravel new auth-demo

Una vez creado el proyecto, asegúrese de generar las claves de la aplicación.

php artisan key:generate

Añadir paquete Laravel JWT

El paquete JWT más común para Laravel es Passport. Ofrece la capacidad de agregar autenticación JWT con múltiples flujos OAuth. Para este tutorial, vamos a utilizar el token de acceso personal recuperado de nuestra propia ruta personalizada. Esto omite requerir redirecciones y tener callbacks.

Vamos a agregar passport a nuestro archivo composer.json usando composer require.

composer require laravel/passport

Esto agregará y registrará automáticamente el passport a nuestro proyecto Laravel.

Migraciones de bases de datos Laravel

Para terminar de instalar passport y tener nuestras tablas requeridas para nuestro usuario y base de datos, vamos a querer agregar nuestras migraciones. En el terminal, ejecute el comando de migración.

php artisan migrate

Configure Passport

Para instalar completamente passport ejecute el siguiente comando en su terminal. Agregará los clientes para los tokens de acceso personal y la contraseña OAuth Grant.

php artisan passport:install

Ahora dentro de su archivo AuthServiceProvider.php, agregue sus rutas para Passport.

public function boot()
    {
        $this->registerPolicies();
        Passport::routes();

        Passport::tokensExpireIn(now()->addDays(15));

        Passport::refreshTokensExpireIn(now()->addDays(30));
        //
    }

Además, configure su archivo config/auth.php para usar passport para su autenticación API.

'guards' => [
        'web' => [
            'driver' => 'session',
            'provider' => 'users',
        ],

        'api' => [
            'driver' => 'passport',
            'provider' => 'users',
        ],
    ],

Añadir JWT al modelo de usuario de Laravel

El siguiente paso es asegurarse de que su modelo de usuario se puede utilizar para crear JWT. Dentro de su modelo User.php, importe Passport y tiene el rasgo de API Tokens.

namespace App;

use Laravel\Passport\HasApiTokens;
use Illuminate\Notifications\Notifiable;
use Illuminate\Foundation\Auth\User as Authenticatable;

class User extends Authenticatable
{
    use HasApiTokens, Notifiable;

Creación de puntos finales de token JWT personalizados de Laravel

Para crear nuestros usuarios y recuperar sus tokens, tendremos que crear un archivo UserController.php.

Dentro de ese controlador, vamos a querer hacer 4 cosas. Registrar usuarios, iniciar sesión usuarios, mostrar que los usuarios detallan y cerrar la sesión.

Registro de Usuarios de Laravel JWT

Comencemos registrando a los usuarios

public function register(Request $request) 
    { 
        $validator = Validator::make($request->all(), [ 
            'name' => 'required', 
            'email' => 'required|email', 
            'password' => 'required', 
            'c_password' => 'required|same:password', 
        ]);
        if ($validator->fails()) { 
            return response()->json(['error'=>$validator->errors()], 401);            
        }
        $input = $request->all(); 
        $input['password'] = bcrypt($input['password']); 
        $user = User::create($input); 
        $success['token'] =  $user->createToken('MyApp')-> accessToken; 
        $success['name'] =  $user->name;
        return response()->json(['success'=>$success], $this-> successStatus); 
    }

En este código, validamos al usuario y nos aseguramos de que su dirección de correo electrónico sea única. Luego nos aseguramos de que la contraseña sea válida. Si la validación falla, devolvemos un error 401. Después de eso, usamos Bcrypt para hash la contraseña del usuario y luego crear el usuario. Creamos un token de acceso y luego devolvemos ese token al usuario cuando el usuario se está registrando.

Dentro de nuestro archivo api.php para nuestras rutas, añadiremos la ruta para ese método controlador.

Route::post('register', 'API\UserController@register');
Laravel JWT User Registration.

Laravel JWT User Registration.

Laravel JWT Usuario Login

Si ya ha creado un usuario y desea iniciar sesión en un usuario existente, puede encontrar ese usuario usando sus credenciales y Eloquent y crear un token para ese usuario.

public function login(Request $request){ 
        if(Auth::attempt(['email' => request('email'), 'password' => request('password')])){ 
            $user = Auth::user(); 
            $success['token'] =  $user->createToken('Password Token')-> accessToken; 
            $success['name'] = $user->name;
            $success['email'] = $user->email;
            return response()->json(['success' => $success], $this-> successStatus); 
        } 
        else{ 
            return response()->json(['error'=>'Unauthorised'], 401); 
        } 
    }
Route::post('login', 'API\UserController@login');
Laravel JWT Login

Laravel JWT Login

Obteniendo los detalles del usuario de JWT Token y cierre de sesión

Para probar que nuestro token está asociado con nuestro usuario, podemos obtener detalles del usuario basados en ese token.

public function details(Request $request) 
    { 
        $user = Auth::user(); 
        return response()->json(['success' => $user], $this-> successStatus); 
    }

Uno de los problemas con los tokens de acceso personal es que son tokens de larga duración. Duran 1 año después de la creación. Esto no es lo que generalmente quieres. Puede solucionar esto permitiendo al usuario revocar su propio token al cerrar la sesión.

public function logout(){
        $value = $request->bearerToken();
        $id = (new Parser())->parse($value)->getHeader('jti');
        $token = $request->user()->tokens->find($id);
        $token->revoke();

        $response = 'You have been logged out';
        return response()->json(['success' => response], 200);
     }

Coloque sus rutas dentro de su middleware API Auth.

Route::group(['middleware' => 'auth:api'], function(){
    Route::post('details', 'API\UserController@details');
    Route::post('logout', 'API\UserController@logout');
});
Auth Token User Details

Auth Token User Details

Conclusión

Tener la capacidad de crear JWT para usted aplicación Laravel permite que su aplicación sea más versátil al autenticar sus otras aplicaciones. Puede agregar aplicaciones React, Vue o incluso Angular como su front-end y almacenar el token en LocalStorage y colocarlo en el encabezado de cada solicitud API. Si estás interesado en aprender más, revisa algunos de nuestros cursos de vídeo.

Codebrains Newsletter

Get weekly dev news and tutorials.

Powered by ConvertKit

This post is also available in: English