时间戳

首页 > 解决方案 > 使用 CSRF 令牌在 React 和 Laravel 之间进行集成

php - 使用 CSRF 令牌在 React 和 Laravel 之间进行集成

问题描述

我有一个全用 Laravel 构建的应用程序，我的页面是使用刀片文件构建的。但是现在我必须将我的前端迁移到 React 并且我在迁移登录表单时遇到了问题。在我的 login.blade.html 中，我使用@CSRF符号来验证表单登录，就像这样：

<form method="POST" action="{{ route('login') }}" id="login-form">
  @csrf
  <div class="row">
     <div class="col-12">
        <div class="form-group">
           <label class="control-label">E-mail*</label>
           <input type="text" class="form-control" name="email" value="{{ old('email') }}" placeholder="Email" />
        </div>
     </div>
     <div class="col-12">
        <div class="form-group">
           <label class="control-label">Senha*</label>
           <input type="password" name="password" class="form-control" placeholder="Senha" />
        </div>
     </div>
     <div class="col-12">
        <div class="d-block d-sm-flex  align-items-center">
           <div class="form-check">
              <input class="form-check-input" type="checkbox" id="gridCheck">
              <label class="form-check-label" for="gridCheck">
                 @lang('home.remember-login')
              </label>
           </div>
           <a href="{{ route('password.request') }}" class="ml-auto">Esqueceu a senha ?</a>
        </div>
     </div>
     <div class="col-12 mt-3" style="z-index:2">
        <button class="btn btn-primary text-uppercase g-recaptcha" 
           data-sitekey="{{env('RECAPTCHA_CLIENT_KEY')}}" 
           data-callback='onSubmit' 
           data-action='login'>@lang('home.login')</button>
     </div>
     <div class="col-12  mt-3">
        <p>Ainda não tem conta?<a href="/register"> Registrar</a></p>
     </div>
  </div>

我创建了一个 API，我可以在其中从 React 向 laravel 发送 POST 请求，但我仍然不知道如何@CSRF使用 API 而不是刀片文件使用相同的身份验证。有人能帮我吗？

标签： phpreactjslaravelapicsrf

解决方案

您可以创建一个元标记并将 csrf 值“csrf_token()”放在一个属性中，然后在 java-script 代码中检索 if。

在你的刀片中：

<meta id ="meta_token" content="{{ csrf_token() }}" />

在你的 js 脚本中：

let token = document.getElementById('meta_token').getAttribute('content');

//Rest of code

推荐阅读