Codeigniter CSRF Ajax錯誤

Question

我正在對視頻進行“喜歡/不喜歡”的ajax調用，我發現提交數據時需要傳遞CSRF令牌。

當用戶單擊喜歡時，我必須調用一個；當用戶單擊不喜歡時，我必須調用一個。 我的問題是，如果用戶單擊喜歡並意識到他們犯了一個錯誤，然后單擊不喜歡，則他們將收到錯誤：

403 Forbidden

The action you have requested is not allowed.

如果用戶首先刷新頁面並更改其選擇，則一切正常。 只有當他們嘗試從一個切換到另一個而沒有刷新時。

這是我的代碼：

<script>
  // like btn
  $('.like-btn').click(function() {
    $('.dislike-btn').removeClass('text-danger');    
    $(this).addClass('liked-video');
    $.ajax({
      type:"POST",
      url: '<?=base_url("videos/like_video")?>',
      data: {video_id: <?=$video_id?>, user_id: <?=$logged_in_userid?>, value: "like", '<?=$this->security->get_csrf_token_name()?>':'<?=$this->security->get_csrf_hash()?>'},
      success: function() {}
    });
  });

  // dislike btn
  $('.dislike-btn').click(function() {
    $('.like-btn').removeClass('text-success');
    $(this).addClass('disliked-video');
    $.ajax({
      type:"POST",
      url: '<?=base_url("videos/dislike_video")?>',
      data: {video_id: <?=$video_id?>, user_id: <?=$logged_in_userid?>, value: "dislike", '<?=$this->security->get_csrf_token_name()?>':'<?=$this->security->get_csrf_hash()?>'},
      success: function() {}
    });
  });
</script>

更改選擇時，為什么會給用戶帶來錯誤？

Answer 1

因此，我從用戶指南中復制了此段。

“令牌可以在每次提交時重新生成（默認），也可以在CSRF Coo​​kie的整個生命周期內保持不變。令牌的默認重新生成可提供更嚴格的安全性，但由於其他令牌無效（向后/向前導航，多個標簽頁/窗口，異步操作等）。您可以通過編輯以下config參數來更改此行為。

嘗試在配置文件中添加/編輯此行：

$ config ['csrf_regeneration'] = TRUE;

Answer 2

還有另一種方法，不需要禁用csrf再生。 您可以將新的csrf令牌發送回調用ajax腳本。

在您的CodeIgniter控制器中：

$data = array('data'=> 'data to send back to browser');
$csrf =  $this->security->get_csrf_hash();
$this->output
    ->set_content_type('application/json')
    ->set_output(json_encode(array('data' => $data, 'csrf' => $csrf)));

$ data =返回瀏覽器的數據

$ csrf =新的csrf令牌，供瀏覽器用於下一個ajax發布請求

顯然，您可以通過其他方式輸出此內容，但是JSON主要用於ajax調用。 在每個帖子響應中也要包含此令牌，以用於下一個帖子請求

然后在您的下一個ajax請求中（javascript）：

var token = data.csrf;

$.ajax({
    url: '/next/ajax/request/url',
    type: 'POST',
    data: { new_data: 'new data to send via post', csrf_token:token },
    cache: false,
    success: function(data, textStatus, jqXHR) {
        // Get new csrf token for next ajax post
        var new_csrf_token = data.csrf     
       //Do something with data returned from post request
    },
    error: function(jqXHR, textStatus, errorThrown) {
      // Handle errors here
      console.log('ERRORS: ' + textStatus + ' - ' + errorThrown );
    }
});

還要記住，在我有csrf_token:token將crf_token替換為在application / config / config.php中找到的令牌名稱，該行指出$config['csrf_token_name'] = 'csrf_token';