您的会话已过期。在 ajax 表单上发布 laravel

Question

我的视图中有以下 html 片段和 js 代码来处理表单请求。

$('#quick-enquiry').on('submit', function(e) {
  e.preventDefault();
  $(".submit").prop("disabled", true);
  data = $(this).serialize();
  action = $(this).attr('action');
  $.ajax({
    type: 'POST',
    url: action,
    data: data,
    headers: {
      "X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content")
    },
    success: function(data) {
      if ($.isEmptyObject(data.error)) {
        $("#quick-enquiry").trigger("reset");
        $('.print-error-msg').find('ul').empty();
        $('.print-error-msg').css('display', 'block');
        $("#response-msg").toggleClass('uk-alert-danger uk-alert-success');
        $('.print-error-msg').find('ul').append("<li>" + data.success + "</li>");
        setTimeout(function() {
          $('.print-error-msg').fadeOut();
          $(".submit").prop("disabled", false);
          UIkit.modal("#modal-quick-enquiry").hide();
        }, 3000);
      } else {
        printMessageErrors(data.error);
      }
    }
  });
});

function printMessageErrors(msg) {
  $('.print-error-msg').find('ul').empty();
  $('.print-error-msg').css('display', 'block');
  $.each(msg, function(key, value) {
    $('.print-error-msg').find('ul').append("<li>" + value + "</li>");
  });
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/uikit/3.0.0-rc.26/js/uikit.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/uikit/3.0.0-rc.26/css/uikit.min.css" rel="stylesheet" />
<form action="{{ route('frontend-postEnquiry') }}" method="POST" id="quick-enquiry">
  <input type="hidden" id="tour-id" value="1">
  <div class="uk-margin">
    <label class="uk-form-label" for="form-stacked-text">Full Name</label>
    <div class="uk-form-controls">
      <input class="uk-input uk-form-width-large" type="text" placeholder="Full Name" id="fullName" name="fullName">
    </div>
  </div>

  <div class="uk-margin">
    <label class="uk-form-label" for="form-stacked-text">Email</label>
    <div class="uk-form-controls">
      <input class="uk-input uk-form-width-large" type="email" placeholder="Email" id="email" name="email">
    </div>
  </div>
  <div class="uk-margin">
    <label class="uk-form-label" for="form-stacked-text">Message</label>
    <div class="uk-form-controls">
      <textarea class="uk-textarea uk-form-width-large" rows="4" placeholder="Some Message...." id="enquiryMessage" name="enquiryMessage"></textarea>
    </div>
  </div>
  <p class="uk-text-right">
    <button class="uk-modal-close-default" type="button" uk-close></button>
    <button class="uk-button uk-button-primary submit uk-width-1-1" type="submit">Send</button>
  </p>
</form>

通过上面的代码，我得到了

419 抱歉，您的会话已过期。请刷新并重试。

我在 ajax 和 head 部分也设置了 CSRF-TOKEN，但似乎我的 js 代码没有获取 csrf 令牌。

如果有人能指出我上面犯的错误，我将非常感激。

Answer 1

尝试使用这个： {{ csrf_field() }} 而不是 @csrf

419 错误主要是因为 CSRF 令牌问题。