csrf token is valid just in first submit using ajax

Hi, i want to submit my form using jquery ajax, it is ok but just for first time i click submit, here is my code ,

my view that contains js :

Code:

<?php

echo form_open(site_url().'/user/ajaxreg' , array('class' => 'email', 'id' => 'form1'));
echo form_label('نusername : ');
echo form_input('username', set_value('username'));
echo form_label('password  : ');
echo form_password('password' , set_value('password'));
echo form_label('  repassword  : ');
echo form_password('repassword');
echo '<br/>';
echo form_submit('submit', 'Sign Up','id="submit"');
echo form_close();

?>

<script>
    $(function(){
        $("#submit").click(function(event){
            event.preventDefault();

            $.ajax({
                    url: "<?=site_url().'/user/ajaxreg';?>",
                    type:'post',
                    data : {
                        <?=$this->security->get_csrf_token_name();?> : "<?=$this->security->get_csrf_hash();?>" ,
                        'username' : 'username01'
                    } ,
                    success:function(result){
                        alert(result);

                    }

            });
        });
</script>

and this is my controller :

Code:

public function ajaxreg()
    {
        $data_post = $this->input->post(array('username','password','repassword'),TRUE);
        var_dump($data_post);
    }

i have enabled csrf protection in config.php

when csrf is disabled in config.php, every thing works fine, but after enabling that, my code works first time i clicking, and after that it doesn't works until i refresh page ,

how i can use ajax+csrf to submit forms in CI#?
thanks

ressan.ir
CI is nice

You can turn regeneration of in the config file by setting $config['csrf_regenerate'] = FALSE;

By default, CodeIgniter generates a new CSRF token on each page request. When doing an AJAX call, the AJAX request is regenerating a new token creating the issue you have.

You can turn regeneration of in the config file by setting $config['csrf_regenerate'] = FALSE;

By default, CodeIgniter generates a new CSRF token on each page request. When doing an AJAX call, the AJAX request is regenerating a new token creating the issue you have.

it works , many thanks,

ressan.ir
CI is nice

Another method would be to return the new csrf hash in the response to your AJAX post, then update the value of the csrf token field in your table in the $.ajax success callback. Then you could just change your data to retrieve the value from the field instead of using "<?=$this->security->get_csrf_hash();?>" in the script.

You could also retrieve the URL from the form so you don't have to repeat that information in the script.

Bonfire

Practical CodeIgniter 3
CodeIgniter Testing Guide

Another method would be to return the new csrf hash in the response to your AJAX post, then update the value of the csrf token field in your table in the $.ajax success callback. Then you could just change your data to retrieve the value from the field instead of using "<?=$this->security->get_csrf_hash();?>" in the script.

You could also retrieve the URL from the form so you don't have to repeat that information in the script.

I know this is an old thread but could you give an example of how to do this?

Another method would be to return the new csrf hash in the response to your AJAX post, then update the value of the csrf token field in your table in the $.ajax success callback. Then you could just change your data to retrieve the value from the field instead of using "<?=$this->security->get_csrf_hash();?>" in the script.

You could also retrieve the URL from the form so you don't have to repeat that information in the script.

I know this is an old thread but could you give an example of how to do this?

My JavaScript/jQuery is a bit rusty, so any example code below might need some work before it functions properly.

One of the easiest ways to manage this would be to add one or two hidden inputs to the form to hold the token/hash values. The inputs would be filled in the usual manner when the form is loaded (either by passing the data to the view or by calling the security methods in the view).

When posting the data in the JavaScript, instead of calling the security methods, you would get the values of the hidden inputs:

Code:

data : {
    $('#csrfTokenName').val() : $('#csrfHash').val(),
    "username": "username01"
}

In the controller method which responds to the AJAX request, you would call $this->security->get_csrf_hash() and $this->security->get_csrf_token_name() and place the values in the result. For example, you might return an object with the requested data, the hash, and the token name:

Code:

class Ajaxcontroller
{
    public function ajaxmethod()
    {
        // get your data, then prep the returned value:
         $result = '{
             "resultData": "some data here",
            "csrfTokenName": "'.$this->security->get_csrf_token_name().'",
            "csrfHash": "'.$this->security->get_csrf_hash().'"
        }';
        // ... send it back to the browser

    }
}

Then your JavaScript would just process the result and update the inputs with the values from the csrfTokenName and csrfHash values in the result.

Code:

.success:function(result){
    $('#csrfTokenName').val(result.csrfTokenName);
    $('#csrfHash').val(resuit.csrfHash);
}

After that, the inputs will contain the new values instead of the values received when the page initially loaded, and the next AJAX request should work properly.

Bonfire

Practical CodeIgniter 3
CodeIgniter Testing Guide

You can turn regeneration of in the config file by setting $config['csrf_regenerate'] = FALSE;

By default, CodeIgniter generates a new CSRF token on each page request. When doing an AJAX call, the AJAX request is regenerating a new token creating the issue you have.

You should never do that, makes your application less secure.