En este artículo, vamos a Verificar Email API Laravel para  que funcione a la perfección con el frontend. La idea es simple: cuando el usuario hace clic en el enlace de verificación que le enviamos por correo, queremos que sea redirigido a una página de éxito en la aplicación frontend, en lugar de llevarlo a la pantalla de inicio de sesión o a cualquier otro sitio que pueda generar confusión.

Este enfoque es ideal para proyectos donde no usamos las vistas de Laravel tradicionales (como Blade), sino que trabajamos únicamente con APIs que interactúan directamente con el frontend. Aquí te explicaré cómo hacer que tu API maneje la verificación del email de una manera fluida y sin vueltas, logrando una experiencia mucho más intuitiva para el usuario.

¿Necesitas un programador ? Contacta conmigo

Problema Común en Verificar Email API Laravel

Un problema frecuente es que, al hacer clic en el enlace de verificación, el usuario es redirigido a la página de inicio de sesión en lugar de ser marcado como verificado y redirigido al frontend. Este inconveniente se debe a que la ruta de verificación requiere autenticación. La solución consiste en manejar la verificación sin exigir que el usuario esté autenticado en el momento de hacer clic en el enlace.

Solución Propuesta

Para implementar la verificación de email sin necesidad de autenticación, seguiremos estos pasos:

  1. Configurar el modelo User para que implemente MustVerifyEmail.
  2. Crear el controlador de autenticación (AuthController) para registrar usuarios y enviar la notificación de verificación.
  3. Definir las rutas para la verificación y el reenvío del enlace de verificación en api.php.
  4. Crear el controlador VerifyEmailController para manejar la verificación sin autenticación.

Implementación Paso a Paso para Verificar Email API Laravel

1. Configurar el Modelo User

Para implementar  Verificar Email API Laravel Asegúrate de que el modelo User implemente MustVerifyEmail y de tener configurado HasApiTokens para manejar los tokens de acceso.


namespace App\Models;

use Illuminate\Contracts\Auth\MustVerifyEmail;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Foundation\Auth\User as Authenticatable;
use Illuminate\Notifications\Notifiable;
use Laravel\Passport\HasApiTokens;

class User extends Authenticatable implements MustVerifyEmail
{
    use HasFactory, Notifiable, HasApiTokens;

    protected $fillable = [
        'name',
        'email',
        'password',
    ];

    protected $hidden = [
        'password',
        'remember_token',
    ];

    protected $casts = [
        'email_verified_at' => 'datetime',
    ];
}
Verificar Email API Laravel

Verificar Email API Laravel

2. Crear el Controlador de Autenticación

En AuthController, configuramos la lógica de registro y login de usuario, generamos un token de acceso para cada usuario y enviamos la notificación de verificación.


namespace App\Http\Controllers;

use App\Models\User;
use Illuminate\Http\Request;
use Illuminate\Auth\Events\Registered;

class AuthController extends Controller
{
    public function register(Request $request)
    {
        $validatedData = $request->validate([
            'name' => 'required|max:55',
            'email' => 'email|required|unique:users',
            'password' => 'required|confirmed'
        ]);

        $validatedData['password'] = bcrypt($request->password);

        $user = User::create($validatedData);

        event(new Registered($user));

        $accessToken = $user->createToken('authToken')->accessToken;

        return response(['user' => $user, 'access_token' => $accessToken]);
    }

    public function login(Request $request)
    {
        $loginData = $request->validate([
            'email' => 'email|required',
            'password' => 'required'
        ]);

        if (!auth()->attempt($loginData)) {
            return response(['message' => 'Invalid Credentials']);
        }

        $accessToken = auth()->user()->createToken('authToken')->accessToken;

        return response(['user' => auth()->user(), 'access_token' => $accessToken]);
    }
}

3. Definir las Rutas de Verificación y Reenvío de Enlace

En el archivo api.php, definimos la ruta de verificación de email y el reenvío del enlace de verificación. La ruta de verificación no tiene el middleware auth, por lo que no requiere autenticación.


// Verify email
Route::get('/email/verify/{id}/{hash}', [VerifyEmailController::class, '__invoke'])
    ->middleware(['signed', 'throttle:6,1'])
    ->name('verification.verify');

// Resend link to verify email
Route::post('/email/verify/resend', function (Request $request) {
    $request->user()->sendEmailVerificationNotification();
    return back()->with('message', 'Verification link sent!');
})->middleware(['auth:api', 'throttle:6,1'])->name('verification.send');

4. Crear el Controlador de Verificación de Email

Finalmente, creamos VerifyEmailController para verificar el email del usuario sin autenticación. Este controlador busca al usuario por su id, y si no ha sido verificado, marca el email como verificado y redirige al frontend a una página de éxito o error.


namespace App\Http\Controllers;

use Illuminate\Auth\Events\Verified;
use Illuminate\Http\RedirectResponse;
use Illuminate\Http\Request;
use Illuminate\Routing\Controller;
use App\Models\User;

class VerifyEmailController extends Controller
{
    public function __invoke(Request $request): RedirectResponse
    {
        $user = User::find($request->route('id'));

        if ($user->hasVerifiedEmail()) {
            return redirect(env('FRONT_URL') . '/email/verify/already-success');
        }

        if ($user->markEmailAsVerified()) {
            event(new Verified($user));
        }

        return redirect(env('FRONT_URL') . '/email/verify/success');
    }
}

Explicación de la Solución

  • La ruta de verificación de email no requiere autenticación, lo que permite a los usuarios verificar su email sin tener que iniciar sesión.
  • El controlador VerifyEmailController utiliza el id en la URL para buscar al usuario y, si no está verificado, marca el email como verificado y lanza el evento Verified.
  • Redirigimos al frontend a una página de éxito o a una de mensaje si el usuario ya había verificado su email.

Conclusión

Esta implementación permite que el usuario verifique su email a través de un enlace enviado en su bandeja de entrada sin necesidad de autenticarse. La solución es ideal para aplicaciones frontend que consumen una API Laravel y requieren flujos de autenticación simplificados.

Contacto

Si necesitas servicios de desarrollo para tu empresa , estoy aquí para ayudarte. Ofrezco soluciones personalizadas y de alta calidad para satisfacer tus necesidades. Para más información o para discutir tu proyecto, contáctame a traves del siguiente botón

Alex Padullés