403 Forbidden error when making an ajax Post request in Django framework

Question

I am trying to integrate jquery into a web application I am making with Django framework  I am however having a hard time trying to make a simple ajax call to work  My template file that contains the form html and javascript to handle the ajax call looks like    lt script type  text javascript  gt    document  ready function          target    submit function     console log  Form was submitted      ajax           type   POST           url    hello        or just url    my-url path           data                query       query    val                         success  function data                console log data                     return false                 lt  script gt   lt form id  target  action     method  post  gt    csrf token      lt input id   query  type  text  value  Hello there  gt    lt input type  submit  value  Search Recent Tweets  gt   lt  form gt    My views py that is supposed to handle the ajax call looks like    from django core context processors import csrf  from django shortcuts import render to response  from django template loader import get template  from django template import Context RequestContext  from django views decorators csrf import ensure csrf cookie  from django http import HttpResponse     access resource  def hello request     c        c update csrf request     if request is ajax            t   get template  template html            html   t render Context   result    hello world             con   RequestContext request    result    hello world            return render to response  template html   c  con    else          return HttpResponse  Not working       I have tried to follow the official documentation on Cross-Site Request Forgery Protection and also looked at several stackoverflow questions addressing a similar problem  I have included the    csrf token    in my html template file but it still doesn t seem to be working  I get an error in the console suggesting that the ajax call failed   POST http   127 0 0 1 8000 hello  403  FORBIDDEN       How do I pass the result variable along with my http response and get the ajax call to work smoothly  Any help is deeply appreciated   Edit-1  I wasn t supposedly passing the csrf token along with my post request  SO as per the documentation I added the following code to my template javascript   function getCookie name    var cookieValue   null  if  document cookie  amp  amp  document cookie              var cookies   document cookie split           for  var i   0  i  lt  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    console log csrftoken      Ajax call function csrfSafeMethod method       these HTTP methods do not require CSRF protection return     GET HEAD OPTIONS TRACE    test method        ajaxSetup       crossDomain  false     obviates need for sameOrigin test     beforeSend  function xhr  settings            if   csrfSafeMethod settings type                 xhr setRequestHeader  X-CSRFToken   csrftoken                         When I refresh the template html page in the browser  I get null in the console  suggesting that the cookie is not set or not defined  What am I missing

User · Answer

For the lazy guys   First download cookie  http   plugins jquery com cookie   Add it to your html    lt script src     static  designer js jquery cookie js      gt  lt  script gt    Now you can create a working POST request   var csrftoken     cookie  csrftoken     function csrfSafeMethod method           these HTTP methods do not require CSRF protection     return     GET HEAD OPTIONS TRACE    test method         ajaxSetup       beforeSend  function xhr  settings            if   csrfSafeMethod settings type   amp  amp   this crossDomain                xhr setRequestHeader  X-CSRFToken   csrftoken                          ajax save url        type    POST       contentType    application json       data   JSON stringify canvas       success  function              alert  Saved

User · Answer

You must change your folder chmod 755 and file  php   html  chmod 644

User · Answer

Because you did not post the csrfmiddlewaretoken  so Django forbid you  this document can help you

User · Answer

With SSL https and with CSRF COOKIE HTTPONLY   False  I still don t have csrftoken in the cookie  either using the getCookie name  function proposed in django Doc or the jquery cookie js proposed by fivef   Wtower summary is perfect and I thought it would work after removing CSRF COOKIE HTTPONLY from settings py but it does nt in https   Why csrftoken is not visible in document cookie     Instead of getting       django language fr  csrftoken rDrGI5cp98MnooPIsygWIF76vuYTkDIt    I get only      django language fr    WHY  Like SSL https removes X-CSRFToken from headers I thought it was due to the proxy header params of Nginx but apparently not    Any idea   Unlike django doc Notes  it seems impossible to work with csrf token in cookies with https  The only way to pass csrftoken is through the DOM by using    csrf token    in html and get it in jQuery by using  var csrftoken      input name  csrfmiddlewaretoken     val      It is then possible to pass it to ajax either by header  xhr setRequestHeader   either by params

User · Answer

Make sure you aren t caching the page view that your form is showing up on  It could be caching your CSRF TOKEN  Happened to me

User · Answer

this works for me template html     ajax       url   quot    url  XXXXXX     quot       type   POST       data   modifica  jsonText   quot csrfmiddlewaretoken quot     quot   csrf token   quot        traditional  true      dataType   html       success  function result          window location href    quot    url  XXX     quot                  view py def aggiornaAttivitaAssegnate request       if request is ajax            richiesta   json loads request POST get  modifica

User · Answer

Another approach is to add X-CSRFTOKEN header with the     csrf token     value like in the following example      ajax               url      url  register lowresistancetyres                   type   POST               headers      lt                             X-CSRFTOKEN       csrf token       lt                                   data    example form  serialize                success  function data                      Success code                            error  function                        Error code

User · Answer

The fastest solution if you are not embedding js into your template is    Put  lt script type  text javascript  gt  window CSRF TOKEN       csrf token       lt  script gt  before your reference to script js file in your template  then add csrfmiddlewaretoken into your data dictionary     ajax               type   POST               url  somepathname    do it                data   csrfmiddlewaretoken  window CSRF TOKEN               success  function                     console log  Success                                If you do embed your js into the template  it s as simple as  data   csrfmiddlewaretoken      csrf token

User · Answer

To set the cookie  use the ensure csrf cookie decorator in your view   from django views decorators csrf import ensure csrf cookie   ensure csrf cookie def hello request       code here

User · Answer

Try including this decorator on your dispatch code  from django utils decorators import method decorator from django views decorators csrf import csrf exempt       method decorator csrf exempt  name  dispatch   def dispatch self  request   args    kwargs        return super LessonUploadWorkView self  dispatch request  args   kwargs

User · Answer

I find all previous answers on-spot but let s put things in context   The 403 forbidden response comes from the CSRF middleware  see Cross Site Request Forgery protection        By default  a    403 Forbidden    response is sent to the user if an incoming request fails the checks performed by CsrfViewMiddleware    Many options are available  I would recommend to follow the answer of  fivef in order to make jQuery add the X-CSRFToken header before every AJAX request with   ajaxSetup   This answer requires the cookie jQuery plugin  If this is not desirable  another possibility is to add   function getCookie name        var cookieValue   null      if  document cookie  amp  amp  document cookie                  var cookies   document cookie split               for  var i   0  i  lt  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      BUT  if the setting CSRF COOKIE HTTPONLY is set to True  which often happens as the Security middleware recommends so  then the cookie is not there  even if  ensure csrf cookie   is used  In this case    csrf token    must be provided in every form  which produces an output such as  lt input name  csrfmiddlewaretoken  value  cr6O9   FUXf6  type  hidden  gt   So the csrfToken variable would simply be obtained with   var csrftoken      input name  csrfmiddlewaretoken     val      Again   ajaxSetup would be required of course   Other options which are available but not recommended are to disable the middleware or the csrf protection for the specific form with  csrf exempt

User · Answer

data    csrfmiddlewaretoken       csrf token       You see  403  FORBIDDEN    because you don t send  csrfmiddlewaretoken  parameter  In template each form has this     csrf token     You should add  csrfmiddlewaretoken  to your ajax data dictionary  My example is sending  product code  and  csrfmiddlewaretoken  to app  basket  view  remove       function            card-body   on  click  function              ajax             type   post             url      url  basket remove                data    product code    07316    csrfmiddlewaretoken       csrf token

[jquery] 403 Forbidden error when making an ajax Post request in Django framework

Examples related to jquery

Examples related to ajax

Examples related to django

Examples related to post