在AJAX响应之后,表单提交上的VerifyCsrfToken异常

时间:2017-11-24 15:04:29

标签: javascript php jquery ajax laravel

我有AJAX动作,它会呈现一个包含多个输入字段和提交按钮的表单。

这是AJAX调用:

<script type="text/javascript">

$('#call_filter').click(function() {
   $.ajax({
    url : 'brandSpendingsFilter',
    type: 'POST',

    data: {company: $('#company').val(), country: $('#country').val(), dateFrom: $('#dateFrom').val(), dateUntil: $('#dateUntil').val(), media: $('#media').val(),
    products: $('[id^=products_]').serialize()},

    beforeSend: function() {$('#search_result').empty(); $("#loading-image2").show(); },
    error: function( jqXhr, textStatus, errorThrown ){
        console.log( errorThrown );
    },
    success : function(data) {
        $("#loading-image2").hide();
       $('#search_result').append(data);
    }
  });
});

</script>

我的表格:

{!! Form::open(['url' => 'brandSpendingsCSV', 'method' => 'POST', 'id' => 'csv']) !!}
{{ csrf_field() }}
<input type="hidden" name="campaignID" value="@foreach($campaignID as $c){{$c}},@endforeach">
<input type="hidden" name="dateFrom" value="{{$dateFrom}}">
<input type="hidden" name="dateUntil" value="{{$dateUntil}}">
<input type="hidden" name="media" value="{{$media}}">
<input type="hidden" name="country" value="{{$country}}">

</tr>
</table>
@if(Auth::user()->isAdmin())

<div class="row" style="float: right;"><button type="submit" onclick="submitForm()" class="btn btn-warning">CSV EXPORT</button></div>
@endif

<br>
<br>

{!! Form::close() !!}

这个onclick函数是简单的提交代码:

<script type="text/javascript">
    function submitForm(){
    $('#csv')[0].submit();
}
</script>

从表单代码中我可以看到,我已经包含了csrf字段。但是在此之后我仍然收到错误VerifyCsrfException。 我尝试过的另一件事是包含AJAX标题:

<script type="text/javascript">

$(document).ready(function () {

    $.ajaxSetup({
        headers: {
            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        }
    });

});
</script>

但仍然存在错误。有什么建议吗?

修改

我将路线类型更改为GET并添加了此

<a href="brandSpendingsCSV?campaignID=@foreach($campaignID as $c){{$c}},@endforeach&dateFrom={{$dateFrom}}&dateUntil={{$dateUntil}}&media={{$media}}&country={{$country}}"><button class="btn btn-warning">CSV EXPORT</button></a>

目前正在运作,但我会保持问题公开,因为这是暂时的解决方案。我需要POST方法。

3 个答案:

答案 0 :(得分:0)

将令牌添加到数据的其余部分:

data: {
        "_token": "{{ csrf_token() }}"
      }

干杯!

答案 1 :(得分:0)

使用jQuery serialize()方法,与所有其他人一起发布的令牌形成数据。

data: $(this).serialize(),

答案 2 :(得分:0)

您正在通过{{ csrf_field() }}用户在页面中创建令牌,因此您可以使用

 headers: {
   'X-CSRF-TOKEN': $('input[name="_token"]').val()
 }

或添加名为_token的元素以发布数据

var _token = $('input[name="_token"]').val();
data: {_token:_token,company: $('#company').val(),

还可以在文本框之前或页面顶部

计算值campaignID