如何修复VerifyCsrfToken.php第46行中的令牌失配异常：使用ajax和laravel 5.0？_Php_Jquery_Laravel

如何修复VerifyCsrfToken.php第46行中的令牌失配异常：使用ajax和laravel 5.0？

php jquery laravel

如何修复VerifyCsrfToken.php第46行中的令牌失配异常：使用ajax和laravel 5.0？,php,jquery,laravel,Php,Jquery,Laravel,我在数据库中插入数据时遇到问题，所以我有一个模块，需要在其中插入歌曲的信息。因此，我只是测试了laravel的较低版本（5.0 laravel版本）和Ajax，以便将请求提交到后端。现在，当我按下提交按钮时，它显示错误 VerifyCsrfToken.php第46行中的令牌不匹配异常：错误：一件事是令牌正在发送到后端我将向你们分享我已经创建的示例代码。请参阅下面的代码路线：： Route::post('/add_song','HomeController@add_song'); $

我在数据库中插入数据时遇到问题，所以我有一个模块，需要在其中插入歌曲的信息。因此，我只是测试了laravel的较低版本（5.0 laravel版本）和Ajax，以便将请求提交到后端。现在，当我按下提交按钮时，它显示错误

VerifyCsrfToken.php第46行中的令牌不匹配异常：

错误：

一件事是令牌正在发送到后端

我将向你们分享我已经创建的示例代码。请参阅下面的代码

路线：：

Route::post('/add_song','HomeController@add_song');

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


$(document).ready(function(){


    $('.btn_add_music').on('click',function(e){

        var song_title = $('#song_title').val();
        var song_artist = $('#song_artist').val();
        var song_lyrics = $('#song_lyrics').val();
        var currentToken = $('meta[name="csrf-token"]').attr('content');

        // var data = new FormData();
        // data.append('song_title',song_title);
        // data.append('song_artist',song_artist);
        // data.append('song_lyrics',song_lyrics);
        // data.append('currentToken',currentToken);

        var formData = '_token=' + $('.token').val();

        $.ajax({
            url: '/add_song',
            data: formData,
            type: 'POST',
            contentType: false, // NEEDED, DON'T OMIT THIS (requires jQuery 1.6+)
            processData: false, // NEEDED, DON'T OMIT THIS
            success:function(res) {
                console.log(res);
            },
            error:function(err) {
                console.log(res);
            }
            // ... Other options like success and etc
        })

    });
});

public function add_song(Request $request) {

    dd($request->all());

    $song_title = $request->get('song_title');
    $song_artist = $request->get('song_artist');
    $song_lyrics = $request->get('song_lyrics');
    return response()->json('Success Inserted');
}

<div class="modal fade" id="ModalSong" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg" role="document">
  <div class="modal-content">
    <div class="modal-header">
      <h5 class="modal-title" id="exampleModalLabel">Ready to Add New Song?</h5>
      <button class="close" type="button" data-dismiss="modal" aria-label="Close">
        <span aria-hidden="true">×</span>
      </button>
    </div>
    <form>
      <div class="modal-body">
         <div class="container-fluid">
           <div class="row">
              <input type="hidden" class="token" name="_token" value="<?php echo csrf_token(); ?>">
              <div class="col-md-6">
                <div class="form-group">
                  <label for="title"><b>Title:</b></label>
                  <input type="text" class="form-control" id="song_title">
                </div>
              </div>
              <div class="col-md-6">
                <div class="form-group">
                  <label for="artist"><b>Artist:</b></label>
                  <input type="text" class="form-control" id="song_artist">
                </div>
              </div>
           </div>

           <div class="form-group">
              <label for="comment"><b>Lyrics:</b></label>
              <textarea class="form-control" rows="5" id="song_lyrics"></textarea>
            </div>
         </div>
      </div>
      <div class="modal-footer">
        <button class="btn btn-danger btn_add_music" type="button">Submit</button>
      </div>
    </form>
  </div>
</div>

前端：：

Route::post('/add_song','HomeController@add_song');

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


$(document).ready(function(){


    $('.btn_add_music').on('click',function(e){

        var song_title = $('#song_title').val();
        var song_artist = $('#song_artist').val();
        var song_lyrics = $('#song_lyrics').val();
        var currentToken = $('meta[name="csrf-token"]').attr('content');

        // var data = new FormData();
        // data.append('song_title',song_title);
        // data.append('song_artist',song_artist);
        // data.append('song_lyrics',song_lyrics);
        // data.append('currentToken',currentToken);

        var formData = '_token=' + $('.token').val();

        $.ajax({
            url: '/add_song',
            data: formData,
            type: 'POST',
            contentType: false, // NEEDED, DON'T OMIT THIS (requires jQuery 1.6+)
            processData: false, // NEEDED, DON'T OMIT THIS
            success:function(res) {
                console.log(res);
            },
            error:function(err) {
                console.log(res);
            }
            // ... Other options like success and etc
        })

    });
});

public function add_song(Request $request) {

    dd($request->all());

    $song_title = $request->get('song_title');
    $song_artist = $request->get('song_artist');
    $song_lyrics = $request->get('song_lyrics');
    return response()->json('Success Inserted');
}

<div class="modal fade" id="ModalSong" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg" role="document">
  <div class="modal-content">
    <div class="modal-header">
      <h5 class="modal-title" id="exampleModalLabel">Ready to Add New Song?</h5>
      <button class="close" type="button" data-dismiss="modal" aria-label="Close">
        <span aria-hidden="true">×</span>
      </button>
    </div>
    <form>
      <div class="modal-body">
         <div class="container-fluid">
           <div class="row">
              <input type="hidden" class="token" name="_token" value="<?php echo csrf_token(); ?>">
              <div class="col-md-6">
                <div class="form-group">
                  <label for="title"><b>Title:</b></label>
                  <input type="text" class="form-control" id="song_title">
                </div>
              </div>
              <div class="col-md-6">
                <div class="form-group">
                  <label for="artist"><b>Artist:</b></label>
                  <input type="text" class="form-control" id="song_artist">
                </div>
              </div>
           </div>

           <div class="form-group">
              <label for="comment"><b>Lyrics:</b></label>
              <textarea class="form-control" rows="5" id="song_lyrics"></textarea>
            </div>
         </div>
      </div>
      <div class="modal-footer">
        <button class="btn btn-danger btn_add_music" type="button">Submit</button>
      </div>
    </form>
  </div>
</div>

后端：：

Route::post('/add_song','HomeController@add_song');

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


$(document).ready(function(){


    $('.btn_add_music').on('click',function(e){

        var song_title = $('#song_title').val();
        var song_artist = $('#song_artist').val();
        var song_lyrics = $('#song_lyrics').val();
        var currentToken = $('meta[name="csrf-token"]').attr('content');

        // var data = new FormData();
        // data.append('song_title',song_title);
        // data.append('song_artist',song_artist);
        // data.append('song_lyrics',song_lyrics);
        // data.append('currentToken',currentToken);

        var formData = '_token=' + $('.token').val();

        $.ajax({
            url: '/add_song',
            data: formData,
            type: 'POST',
            contentType: false, // NEEDED, DON'T OMIT THIS (requires jQuery 1.6+)
            processData: false, // NEEDED, DON'T OMIT THIS
            success:function(res) {
                console.log(res);
            },
            error:function(err) {
                console.log(res);
            }
            // ... Other options like success and etc
        })

    });
});

public function add_song(Request $request) {

    dd($request->all());

    $song_title = $request->get('song_title');
    $song_artist = $request->get('song_artist');
    $song_lyrics = $request->get('song_lyrics');
    return response()->json('Success Inserted');
}

<div class="modal fade" id="ModalSong" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg" role="document">
  <div class="modal-content">
    <div class="modal-header">
      <h5 class="modal-title" id="exampleModalLabel">Ready to Add New Song?</h5>
      <button class="close" type="button" data-dismiss="modal" aria-label="Close">
        <span aria-hidden="true">×</span>
      </button>
    </div>
    <form>
      <div class="modal-body">
         <div class="container-fluid">
           <div class="row">
              <input type="hidden" class="token" name="_token" value="<?php echo csrf_token(); ?>">
              <div class="col-md-6">
                <div class="form-group">
                  <label for="title"><b>Title:</b></label>
                  <input type="text" class="form-control" id="song_title">
                </div>
              </div>
              <div class="col-md-6">
                <div class="form-group">
                  <label for="artist"><b>Artist:</b></label>
                  <input type="text" class="form-control" id="song_artist">
                </div>
              </div>
           </div>

           <div class="form-group">
              <label for="comment"><b>Lyrics:</b></label>
              <textarea class="form-control" rows="5" id="song_lyrics"></textarea>
            </div>
         </div>
      </div>
      <div class="modal-footer">
        <button class="btn btn-danger btn_add_music" type="button">Submit</button>
      </div>
    </form>
  </div>
</div>

Html:：

Route::post('/add_song','HomeController@add_song');

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


$(document).ready(function(){


    $('.btn_add_music').on('click',function(e){

        var song_title = $('#song_title').val();
        var song_artist = $('#song_artist').val();
        var song_lyrics = $('#song_lyrics').val();
        var currentToken = $('meta[name="csrf-token"]').attr('content');

        // var data = new FormData();
        // data.append('song_title',song_title);
        // data.append('song_artist',song_artist);
        // data.append('song_lyrics',song_lyrics);
        // data.append('currentToken',currentToken);

        var formData = '_token=' + $('.token').val();

        $.ajax({
            url: '/add_song',
            data: formData,
            type: 'POST',
            contentType: false, // NEEDED, DON'T OMIT THIS (requires jQuery 1.6+)
            processData: false, // NEEDED, DON'T OMIT THIS
            success:function(res) {
                console.log(res);
            },
            error:function(err) {
                console.log(res);
            }
            // ... Other options like success and etc
        })

    });
});

public function add_song(Request $request) {

    dd($request->all());

    $song_title = $request->get('song_title');
    $song_artist = $request->get('song_artist');
    $song_lyrics = $request->get('song_lyrics');
    return response()->json('Success Inserted');
}

<div class="modal fade" id="ModalSong" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg" role="document">
  <div class="modal-content">
    <div class="modal-header">
      <h5 class="modal-title" id="exampleModalLabel">Ready to Add New Song?</h5>
      <button class="close" type="button" data-dismiss="modal" aria-label="Close">
        <span aria-hidden="true">×</span>
      </button>
    </div>
    <form>
      <div class="modal-body">
         <div class="container-fluid">
           <div class="row">
              <input type="hidden" class="token" name="_token" value="<?php echo csrf_token(); ?>">
              <div class="col-md-6">
                <div class="form-group">
                  <label for="title"><b>Title:</b></label>
                  <input type="text" class="form-control" id="song_title">
                </div>
              </div>
              <div class="col-md-6">
                <div class="form-group">
                  <label for="artist"><b>Artist:</b></label>
                  <input type="text" class="form-control" id="song_artist">
                </div>
              </div>
           </div>

           <div class="form-group">
              <label for="comment"><b>Lyrics:</b></label>
              <textarea class="form-control" rows="5" id="song_lyrics"></textarea>
            </div>
         </div>
      </div>
      <div class="modal-footer">
        <button class="btn btn-danger btn_add_music" type="button">Submit</button>
      </div>
    </form>
  </div>
</div>


准备好添加新歌了吗？
×
我相信你的代币寄错了。这种语法似乎有问题，但不是我的专业领域。请尝试以下方法
var formdata= new FormData();    
fd.append('_token', $('.token').val());

，也许这会帮助你为什么contentType:false
？@apokryfos它给出了非法调用hi-mrhn，谢谢你，mrhn它在这里工作。我只是测试了laravel的较低版本，但在较新的版本中，所有功能都正常。