问题描述
我尝试了几乎所有可能的方法,但 Google One Tap 登录按钮在我的 Laravel 8 应用程序中返回 504 错误。我正在使用 laravel socialite 来处理登录过程,如果我放置一个链接按钮而不是 Google 登录按钮,它绝对可以正常工作。
这是我的一键按钮代码:
<div id="g_id_onload" data-client_id="{{ config('services.google.client_id') }}" data-context="signin" data-login_uri="{{ route('frontend.auth.social.login','google') }}" data-auto_prompt="true"></div>
<div class="g_id_signin" data-type="standard" data-shape="rectangular" data-theme="filled_blue" data-text="signin_with" data-size="large" data-logo_alignment="left"></div>
这是我得到的错误:
糟糕!发生错误 服务器返回“405 Method Not Allowed”。 东西坏了。请让我们知道发生此错误时您在做什么。我们会尽快修复它。给您带来的不便,敬请谅解。
解决方法
来自 Google one tab 的响应是 post not get request
,我研究了@Mohamed ِRadwan 提供的解决方案,并更新了我的社交名流路线文件,如下所示:
Route::group(['as' => 'auth.'],function () {
Route::group(['middleware' => 'guest'],function () {
// Socialite Routes
Route::any('login/{provider}',[SocialController::class,'redirect'])->name('social.login');
Route::get('login/{provider}/callback','callback']);
});
});
这使得 One Tap 提示可以根据社交名流的需要工作,但登录按钮仍然不起作用并抛出 419(意味着页面过期 - 由于 csrf 令牌不匹配)令人惊讶我按照这篇文章发送了 csrf 令牌:
How to handle google one tap with laravel csrf
这是我的登录按钮代码:
<div id="g_id_onload"
data-client_id="{{ config('services.google.client_id') }}"
data-context="signin"
data-ux_mode="redirect"
data-login_uri="{{ route('frontend.auth.social.login','google') }}"
data-_token="{{ csrf_token() }}"
data-auto_prompt="true">
</div>
<div class="g_id_signin"
data-type="standard"
data-shape="rectangular"
data-theme="filled_blue"
data-text="signin_with"
data-size="large"
data-logo_alignment="left">
</div>
似乎 csrf tken 即将到期,因为按钮导航到 google uri 以选择帐户,这里是 csrf 令牌过期的地方。
所以我在我的 VerifyCsrfToken.php 中间件中关闭了 google socialite 路由的 csrf 验证,如下所示:
protected $except = [
'login/google',];
瞧,它奏效了。