Question

通过wysiwyg编辑器上传图像时，我需要使用FormData()传递Laravel CSRF令牌。但它似乎失败了，或者它没有使用append()方法添加csrf标记。

这是我的代码：

  function uploadImage( image ) {
    var data = new FormData();
    data.append( "image", image );

    data.append( "csrfToken", Laravel.csrfToken ); // <- adding csrf token
    // Laravel.csrfToken will return the csrf token.

    console.log( data.entries() );
    $.ajax ({
      data: data,
      type: "POST",
      url: "/article/store/image",
      cache: false,
      contentType: false,
      processData: false,
      success: function(url) {
        var image = IMAGE_PATH + url;
          $( '#editor' ).summernote( "insertImage", image );
        },
        error: function( data ) {
          console.log( data );
        }
    });
  }

它没有使用表单数据添加laravel csrf标记，因为我仍然收到错误

VerifyCsrfToken.php第68行中的TokenMismatchException

如何使用表单数据添加令牌？

Answer 1

您应该添加名为 - _token的字段，而不是csrfToken，如下所示：

data.append( "_token", Laravel.csrfToken ); // <- adding csrf token

这是Laravel的辅助方法 - Volume-Weighted Average Prive (VWAP)。

根据csrf_field()，在Ajax调用的情况下 - 例如，您可以将令牌存储在HTML元标记中::

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

然后像这样包含在你的ajax标题中：

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

希望这有帮助！

Answer 2

对于ajax请求，我喜欢用$ .ajaxSetup设置一次。

在我的布局中：

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

在我的app.js中：

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

这使我无需记住将_token输入附加到每个请求。

Answer 3

虽然@Saumya已经回答了这个问题，我使用标题来发送CSRF令牌，如下所示：

$.ajax ({
  data: data,
  type: "POST",
  headers: {'X-CSRF-TOKEN': Laravel.csrfToken },
  url: "/article/store/image",
  cache: false,
  contentType: false,
  processData: false,
  success: function(url) {
    var image = IMAGE_PATH + url;
      $( '#editor' ).summernote( "insertImage", image );
    },
    error: function( data ) {
      console.log( data );
    }
});

如果您使用ajax在整个应用程序中发送多个请求，则可以一次为每个请求全局设置：

$.ajaxSetup({
headers: {
    'X-CSRF-TOKEN': Laravel.csrfToken
}
});

了解详情Here

使用表单数据添加laravel CSRF令牌

3 个答案: