在Ajax中在Codeigniter中启用csrf时收到403禁止错误

Question

I am using codeigniter with csrf enabled. i am making some ajax post requests but somehow i am getting 403 post forbidden error. my folder structure is like this i have included this js in which ajax code is written outside of application folder. the code i am using for ajax request is

var data = {
    name: $('.name').val(),
    crm_csrf_token: $('input[name="crm_csrf_token"]').val()
} 
var url = 'http://demo/signup/signup';
$.ajax({
    url: url,
    dataType: 'json',
    type: 'post',
    contentType: 'application/json',
    data: data,
    success: function( data, textStatus, jQxhr ){
        console.log(data);
        console.log(textStatus);
        console.log(jQxhr);
    },
    error: function( jqXhr, textStatus, errorThrown ){
        console.log(jqXhr);
        console.log(textStatus);
        console.log(errorThrown);
    }
});

so where am i going wrong. before making this ajax call i am validating form using javascript too. site_url() and base_url is not accessible outside application forlder too.

Answer 1

Try this working for me, I guess its problem with your url. Here i correct this, might be work for you.

JQuery

var data = {
    name: $('.name').val(),
    crm_csrf_token: $('input[name="crm_csrf_token"]').val()
}

//Url should be index.php/YourControllerName/YourMethodName
var url = '<?php echo base_url(); ?>index.php/demo/signup';
$.ajax({
    url: url,
    dataType: 'json',
    type: 'post',
    contentType: 'application/json',
    data: data,
    success: function( data, textStatus, jQxhr ){
        console.log(data);
        console.log(textStatus);
        console.log(jQxhr);
    },
    error: function( jqXhr, textStatus, errorThrown ){
        console.log(jqXhr);
        console.log(textStatus);
        console.log(errorThrown);
    }
});

CI Controller :

<?php

class demo extends CI_Controller {
    public function signup()
    {
            echo 'Hello World!';
    }
}

Greetings!

Answer 2

you just need to send csrf token via using jquery cookie you can download it from here https://github.com/js-cookie/js-cookie

now in your ajax call

$.ajax({

url:url,
data:{
   "<?php echo $this->security->get_csrf_token_name(); ?>": Cookies.get('your_csrf_cookie_name_in_config')
    },
method :"POST",
success:function(data){
 $("#city").html(data);
}

});