Laravel Fortify 2FA恢复码登录失效问题求助

问题根源分析 #

你的恢复码登录功能报错，核心原因是表单代码存在字段命名错误和冗余代码，导致后端无法正确识别恢复码参数。

具体修复步骤 #

1. 修复输入字段的命名错误 #

恢复码输入框的name和id末尾多了空格，且错误提示的字段名不匹配：

• 将恢复码输入框代码改为：

  <input type="text" class="form-control" id="recovery_code" placeholder="Recovery Code" name="recovery_code">
  

• 将错误提示的字段名修正为和输入框一致：

  @error('recovery_code')
      <span class="invalid-feedback" style="display: block;" role="alert"><strong>{{ $message }} </strong></span>
  @enderror
  

2. 移除重复的@csrf #

整个表单只需要一个@csrf令牌，恢复码区块里的@csrf是冗余的，直接删除即可，避免重复提交令牌导致验证异常。

3. 统一表单路由 #

Laravel默认的2FA验证路由（同时支持验证码和恢复码）的路由名称是two-factor-challenge，而非two-factor.login（你在route:list中看不到这个别名，说明它不存在）。将表单的action改为：

action="{{ route('two-factor-challenge') }}"

修正后的完整表单代码 #

<div class="col-md-12 ps-md-0" x-data="{ showRecovery: false, showCode: true }" x-cloak>
    <div class="auth-form-wrapper px-4 py-5">
        <form class="reset-password-form" method="POST" action="{{ route('two-factor-challenge') }}">
            @csrf
            <div x-show="showCode">
                <h5 class="text-muted fw-normal mb-4 mt-4">Enter Authentication Code</h5>
                <div class="mb-3">
                    <input type="password" class="form-control" id="password" placeholder="Code" name="code">
                    @error('code')
                        <span class="invalid-feedback" style="display: block;" role="alert"><strong>{{ $message }} </strong></span>
                    @enderror
                </div>
                <div class="d-flex justify-content-start">
                    <button class="btn btn-primary me-2 mb-2 mb-md-0" type="submit">Submit</button>
                </div>
                <a role="button" x-on:click="showRecovery = true, showCode = false" class="d-block mt-3 text-muted">Use Recovery Code Instead</a>
            </div>

            <div x-show="showRecovery">
                <h5 class="text-muted fw-normal mb-4 mt-4">Enter Recovery Code</h5>
                <div class="mb-3">
                    <input type="text" class="form-control" id="recovery_code" placeholder="Recovery Code" name="recovery_code">
                    @error('recovery_code')
                        <span class="invalid-feedback" style="display: block;" role="alert"><strong>{{ $message }} </strong></span>
                    @enderror
                </div>
                <div class="d-flex justify-content-start">
                    <button class="btn btn-primary me-2 mb-2 mb-md-0" type="submit">Submit</button>
                </div>
                <a role="button" x-on:click="showRecovery = false, showCode = true" class="d-block mt-3 text-muted">Use Authentication Code Instead</a>
            </div>
        </form>
    </div>
</div>

为什么这些修改能解决问题？ #

• 字段名带空格会导致Laravel无法正确解析recovery_code参数，后端会默认尝试验证验证码，从而抛出"验证码无效"的错误。
• 重复的@csrf可能导致令牌冲突，破坏表单验证逻辑。
• 使用正确的默认路由别名，确保请求被发送到Laravel内置的2FA处理控制器，该控制器会自动区分验证码和恢复码进行验证。

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