Question

我正在尝试使用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');

Answer 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);
     }
    }
});
});

});

Answer 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
});

Answer 3

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

ManagerTest.swift

Answer 4

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

Answer 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>

Answer 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>

我希望它对您有用

获取CSRF令牌不匹配Laravel

6 个答案: