[Answered ]-Forbidden 403 during CSRF check with an AJAX POST request in Django

2👍

I was also facing the same issue, but it got resolved.

Information:
I had a basic contact form which makes POST request to Django View ‘/contact-form’. But it was giving ‘403 Forbidden’ error. The HTML is as follows:

<form method="post">
    {% csrf_token %}
    <input>...</input>
    <button id="contact-form" type="submit"> <span>Envoyer</span</button>
</form>

Reason: It says that the Django Url is protected by any forgery and you should include a CSRF token in you Ajax call.

Solution:
1) Get CSRF token before making Ajax request like this:

var csrftoken = jQuery("[name=csrfmiddlewaretoken]").val();

2) And then include csrftoken in you Ajax request header like this:

        jQuery.ajax({
            type: "POST",
            url: "/contact-form/",
             headers: {
                'X-CSRFToken': csrftoken
           },
            data: data,
            success: function() {
                alert('success');
            }
        });
👤ARKhan

1👍

You can add {% csrf_token %} template tag in your form or posting function the make posting , if you want to avoid the error you can use decorater @csrf_exempt

 from django.views.decorators.csrf import csrf_exempt
    @csrf_exempt
    def hello(request):
       if request.is_ajax():
          print "hello is working fine"

more details : https://docs.djangoproject.com/en/1.7/ref/contrib/csrf/

0👍

To account for CSRF using ajax, try following the Django docs suggestion of aquiring the token via JS: https://docs.djangoproject.com/en/1.9/ref/csrf/#ajax

Create a JS file called csrf.js using the following (assuming jQuery):

// using jQuery
function getCookie(name) {
    var cookieValue = null;
    if (document.cookie && document.cookie != '') {
        var cookies = document.cookie.split(';');
        for (var i = 0; i < cookies.length; i++) {
            var cookie = jQuery.trim(cookies[i]);
            // Does this cookie string begin with the name we want?
            if (cookie.substring(0, name.length + 1) == (name + '=')) {
                cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
                break;
            }
        }
    }
    return cookieValue;
}
var csrftoken = getCookie('csrftoken');

Include
that JS file on the template containing your ajax JS.

You should then be able to do what you need safely.

-1👍

When you use csrfmiddlewaretoken in your templates you use {% csrf_token %} i.e include in somewhere in your html body. {% csrf_token %} is evaluated to

<input type="hidden" name="csrfmiddlewaretoken" value="somevalue">

You can then use jquery to lookup this particular hidden field and retrieve its value and pass it in your ajax call.

Leave a comment