CSRF和ajax表单在codeigniter 3中使用knockout js点击绑定提交 - 禁止错误

时间:2016-03-30 08:18:24

标签: jquery ajax codeigniter knockout.js

我试图通过ajax post方法通过敲击js点击绑定点击按钮提交用户表单。我收到的错误是403 - 禁止。

我确信它与CSRF有关,但无法弄明白。

View.php:

<?php echo form_open('client/search_client_database', ['role' => 'form']); ?>
  <fieldset>
    <div class="form-group">
      <label class="sr-only" for="search_client_input">Search for existing   clients</label>
      <div class="input-group">
      <input class="form-control input-sm" type="text" id="search_client_input" name="search_client_input" placeholder="Search for existing clients...">
      <span class="input-group-btn">
          <button class="btn btn-primary btn-sm" type="button" data-bind="click: search_client">Search</button>
      </span>
    </div>
   </div>
  </fieldset>
<?php echo form_close(); ?>

点击按钮,触发敲击Js点击绑定以启动对控制器的ajax调用。 Knockout js代码位于一个单独的js文件中,该文件与视图一起加载。

Client.js文件:

var base_url = window.location.origin;
var url = base_url+"/client/";

this.search_client = function()
        {           
            crsf = $("input[name=csrf_test_name]").val();
            dataString = $("#search_client_input").val();
            alert(crsf);
            $.ajax({
                url: url+"search_client_database",
                type: "post",
                cache: false,
                data: {crsf: crsf, data: dataString},
                success: function(customer_details) {
                    alert(customer_details);                    
                },
                error: function(xhr, ajaxOptions, thrownError)
                {
                    alert(xhr.status);
                    alert(thrownError);
                }
            });
        }

控制器:

public function search_client_database()
    {
        $data = $this->input->post('data');
        echo $data;
    }

我一直得到xhr错误403即禁止。 URL中没有任何错误。

1 个答案:

答案 0 :(得分:1)

您必须使用与$config['csrf_token_name']中配置的名称相同的名称发送回csrf令牌。

根据您的代码,它的名称为csrf_test_name,因此您需要在Ajax请求的data中使用它:

$.ajax({
  url: url + "search_client_database",
  type: "post",
  cache: false,
  data: {
    "csrf_token_name": crsf,
    data: dataString
  },
  success: function(customer_details) {
    alert(customer_details);
  },
  error: function(xhr, ajaxOptions, thrownError) {
    alert(xhr.status);
    alert(thrownError);
  }
});