如何在Laravel中处理Google One Tap的CSRF验证问题？

Hey there, let's tackle that frustrating 419 error you're getting with Google One Tap in your Laravel app. The core issue here is that Google's One Tap POST request doesn't (and can't) carry your Laravel app's CSRF token, so the default CSRF validation kicks in and rejects the request. Here's how to fix it properly, while keeping your app secure:

1. Exclude the Callback Route from CSRF Validation #

First, we need to tell Laravel to skip CSRF checks for your Google callback route. Open up app/Http/Middleware/VerifyCsrfToken.php and add your callback route URI to the $except array:

<?php

namespace App\Http\Middleware;

use Illuminate\Foundation\Http\Middleware\VerifyCsrfToken as Middleware;

class VerifyCsrfToken extends Middleware
{
    /**
     * The URIs that should be excluded from CSRF verification.
     *
     * @var array<int, string>
     */
    protected $except = [
        'google2/callback', // Add your callback URI here
    ];
}

If you prefer using the route name instead of the raw URI, you can replace the string with route('google2.callback')->uri()—but using the direct URI is more straightforward and avoids issues if you ever rename the route.

2. Validate the Google ID Token (Critical for Security!) #

Skipping CSRF validation means we need another way to ensure the request actually comes from Google. The safest way is to verify the ID token Google sends in the request.

First, make sure you have the Google Client library installed (if you don't already):

composer require google/apiclient:^2.0

Then, in your callback controller method, add code to verify the token:

use Illuminate\Http\Request;
use Google\Client as GoogleClient;

public function callback(Request $request)
{
    $googleClient = new GoogleClient();
    $googleClient->setClientId(config('google.google_client_id'));

    // Verify the ID token sent by Google
    $payload = $googleClient->verifyIdToken($request->input('credential'));

    if (!$payload) {
        // Invalid token—redirect back with an error
        return redirect()->route('login')->with('error', 'Invalid Google authentication attempt.');
    }

    // Now you can safely use the payload data to handle login/registration
    $userEmail = $payload['email'];
    $userName = $payload['name'];
    $userAvatar = $payload['picture'];

    // ... Your existing user lookup/creation logic here
}

This step is non-negotiable—it prevents malicious actors from sending fake requests to your callback route.

3. Clean Up Your Frontend Code #

That _token parameter you added to the g_id_onload div doesn't do anything, since Google One Tap doesn't pass it along. You can remove it to clean up your code:

<div id="g_id_onload" 
     data-client_id="{{ config('google.google_client_id') }}" 
     data-login_uri="{{ route('google2.callback') }}">
</div>

Why This Works #

Laravel's CSRF protection is designed to prevent cross-site request forgery from other websites, but Google's One Tap request is a legitimate third-party service call that can't access your app's CSRF token. By excluding the route from CSRF checks and instead verifying the Google-provided ID token, you maintain security while allowing the authentication flow to work.

内容的提问来源于stack exchange，提问作者grimdbx