Search code examples
codeignitercsrfhttp-status-code-403ajaxformajax-forms

Codeigniter form_open_multipart showing 403 Forbidden (CSRF)


I am trying to post data though ajax post but somehow unable to post . am getting 403 forbidden. Fortunately my other ajax posts are submitting properly as they are getting right re-generated token. But in form_open_multipart it's not working.

CI config

$config['csrf_protection'] = TRUE;
$config['csrf_token_name'] = 'my_token';
$config['csrf_cookie_name'] = 'my_cookie';
$config['csrf_expire'] = 7200;
$config['csrf_regenerate'] = TRUE;
$config['csrf_exclude_uris'] = array();

form_open is working well, but in the case of multi part it's not working well !!!!

my HTML

<?php $parameter = array('id' => 'frm_id', 'class' => 'form-horizontal'); echo form_open_multipart('controller/save',$parameter) ;?>
<div class="form-body">
    <div class="form-group">
        <label class="col-md-3 control-label">Name</label>
        <div class="col-md-6">
            <div class="input-icon">
                <i class="fa fa-bell-o"></i>
                <input type="text" id="catId" class="form-control " placeholder="Type Something..." name='name' /> 
            </div>
        </div>
    </div>
    <div class="form-group">
        <label class="col-md-3 control-label">Description</label>
        <div class="col-md-6">
            <div>
                <textarea class="form-control" rows="3" name="description"></textarea>
            </div>
        </div>
    </div>
    <div class="form-group">
        <label class="col-md-3 control-label">Image 1</label>
        <div class="col-md-6">
            <div>
                <input type="file" name="thumb_image">
            </div>
        </div>
    </div>
    <div class="form-group">
        <label class="col-md-3 control-label">Image 2</label>
        <div class="col-md-6">
            <div>
                <input type="file" name="banner_image">
            </div>
        </div>
    </div>
</div>
<div class="form-actions">
    <div class="row">
        <div class="col-md-offset-3 col-md-9">
            <button type="submit" class="btn btn-flat green">Submit</button>
            <button type="button" class="btn btn-flat grey-salsa">Cancel</button>
        </div>
    </div>
</div>
<?php echo form_close() ;?> 

My JS

<script type="text/javascript">
    var frmSave = $('#frm_id'); 
    frmSave.on('submit', function(event){
        event.preventDefault();
        $form=$(this);
        var fd = new FormData($('#frm_id')[0]);
        $.ajax({
            url: $form.attr('action'),
            type: $form.attr('method'),
            dataType: 'json',
            data: fd,
            contentType: false,
            cache: false,  
            processData: false,
            success: function(data){
                console.log(data)
            }
        })             
    });
</script>

Still I am getting this message

An Error Was Encountered. The action you have requested is not allowed.


Solution

  • var vl = "; " + document.cookie;
    var pr = vl.split("; csrf_cookie=");
    var obj; if (pr.length == 2) { obj = pr.pop().split(";").shift(); }
    

    using this variable in the ajax body section like

    data : '<?php echo $this->security->get_csrf_token_name(); ?>': obj
    

    Now it's working fine.