获取 CSRF 令牌不匹配 Laravel答案

【问题标题】：Getting CSRF token mismatch Laravel获取 CSRF 令牌不匹配 Laravel
【发布时间】：2020-06-28 09:43:48
【问题描述】：

我正在尝试使用 javascript 提交表单，但我不断收到此错误 CSRF token mismatch。我试图将var url = "{{ route('review.store') }}"; 更改为{{ route('review.store') }}?_token={{ csrf_token() }}，它正在将表单提交到没有数据的数据库。我见过很多类似的问题，但我的情况没有解决方案。我该如何解决这个问题？

<form id="form" enctype="multipart/form-data">
    <input type="hidden" value="{{csrf_token()}}" id="token"/>
<div class="form-group" >
<label for="title">Title</label>
<input type="text" name="title" >
</div>

<div class="form-group">
<label for="description">Description</label>
<input type="text" name="description">
</div>
</form>
<input type='button' value="Submit" id="btn"/>

Javascript

var token = $("#token").val();
$(document).ready(function(){

$("#btn").click(function(event){
event.preventDefault();
var url = "{{ route('review.store') }}";
var form = $('#form')[0];
var formData = new FormData(form);
formData.append('_token', token);
$.ajax({
    url: url,
    data: formData,
    type: 'POST',
    cache: false,
    contentType: false,
    processData: false,
    success:function(data){
    if($.isEmptyObject(data.error)){
    $("#msg").html("successfull");
    $("#msg").fadeOut(3000);
     }
    }
});
});

});

路线

  Route::resource('review','ProductReviewController');

【问题讨论】：

请求负载是否具有_token 值？用浏览器开发工具确认。
是的 @ab.in
请添加您的web.php 文件。
检查updated@ab.in
您确定您的请求到达了正确的终点吗？你能添加请求有效负载的屏幕截图吗？

标签： javascript php ajax laravel laravel-5

【解决方案1】：

您在隐藏字段中缺少名称_token，只需序列化形成并发送请求

    <form id="form" enctype="multipart/form-data">

    <input type="hidden" name ="_token" value="{{csrf_token()}}" id="token"/>
    <div class="form-group" >
    <label for="title">Title</label>
    <input type="text" name="title" >
    </div>

    <div class="form-group">
    <label for="description">Description</label>
    <input type="text" name="description">
    </div>
<input type='button' value="Submit" id="btn"/>

    </form>


$(document).ready(function(){

$("#btn").click(function(event){
event.preventDefault();
var url = "{{ route('review.store') }}";
var formData = $('#form').serializeArray();
$.ajax({
    url: url,
    data: formData,
    type: 'POST',
    cache: false,
    contentType: false,
    processData: false,
    success:function(data){
    if($.isEmptyObject(data.error)){
    $("#msg").html("successfull");
    $("#msg").fadeOut(3000);
     }
    }
});
});

});

【讨论】：

我补充说，仍然显示CSRF token mismatch."@Lalit Kumar
我已经检查过了
如何序列化表单？ @Lalit Kumar
仍然显示 CSRF token mismatch." 并在有效负载中显示此 [object Object],[object Object],[object Object],[object Object],[object Object] @Lalit Kumar
打印请求不是那个数据

【解决方案2】：

在您的 jquery 中，请像这样获取令牌：

    var data = {
        "_token": $('#token').val()
    };

你也可以试试

    data: {
       "_token": "{{ csrf_token() }}",
       "id": myid
    }

所以你的ajax请求将是

$.ajax({
  url : "url",
  method:"post",
  data : {
    "_token": $('#csrf-token')[0].content
  },
  // Other stuffs to do
});

【讨论】：

【解决方案3】：

请尝试这样使用，而不是序列化您的表单数据

<form id="form" enctype="multipart/form-data">    
    {{csrf_field()}}
    <div class="form-group" >
        <label for="title">Title</label>
        <input type="text" name="title" >
    </div>
    <div class="form-group">
        <label for="description">Description</label>
        <input type="text" name="description">
    </div>
    <input type='button' value="Submit" id="btn"/>
</form>

【讨论】：

【解决方案4】：

尝试使用@csrf 或{{ csrf_field() }}

【讨论】：

【解决方案5】：

你仍然可以试试这个。我带走了表单上的表单标签和csrf令牌

//形式

    <div class="form-group" >
    <label for="title">Title</label>
    <input type="text" id="title" name="title" >
    </div>

    <div class="form-group">
    <label for="description">Description</label>
    <input type="text" id="description" name="description">
    </div>
    </form>
    <input type='button' class="btn-submit" value="Submit" id="btn"/>

//ajax调用

<script>
$(function() {
   $(".btn-submit").click(function(e){

        var title= $("input[name=title]").val();

        var description= $("input[name=description]").val();


        $.ajax({
              url: murl +'/your-url',
              type: "post",
              data: {'title':title, 'description':description, '_token':  $('input[name=_token]').val()},
              success: function(data){

              console.log(data);

              }


        });


    });


});



</script>

【讨论】：

所以url: murl +'/your-url', 中的murl 是什么，因为我收到了murl is not defined @Julius Fasema
哦！实际上浏览器上的应用程序 url 已经在布局上定义了。因此，murl 所做的是选择定义的 url，将其缩短并将其附加到 ajax 调用上的 url。抱歉，您可以将其从您的机箱中移除。
我试过这样显示错误 CSRF token mismatch 但它显示了 formData{title, description} @Julius Fasema
它必须做 Session::flush()。尝试解决这个问题
怎么样？你能更新你的答案吗@Julius Fasema

【解决方案6】：

解决“X-CSRF-TOKEN”这个问题的最佳方法是在主布局中添加以下代码，并继续正常进行 ajax 调用：

在标题中

<meta name="csrf-token" content="{{ csrf_token() }}" />

在 Form 中，在表单内的任何地方添加 csrf 标记

<form>
{{ csrf_field() }}
</form>

在脚本中

<script type="text/javascript">
$.ajax({
    url: url,
    data: formData,
    type: 'POST',
    cache: false,
    contentType: false,
    processData: false,
    headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    success:function(data){
    if($.isEmptyObject(data.error)){
    $("#msg").html("successfull");
    $("#msg").fadeOut(3000);
     }
    }
});

</script>

希望对你有用

【讨论】：

【解决方案7】：

我建议你应该使用

@csrf

和

@method("PUT")

在您的表单 HTML 标记中，然后new FormData() 处理 crsf 和方法输入

【讨论】：