带有ajax和django post的csrf

Posted 2023-02-24

【中文标题】带有ajax和django post的csrf

【英文标题】：csrf with ajax and django post

【发布时间】：2012-05-20 16:58:47

【问题描述】：

使用 jquery1.7.1 和 django1.3 ，我试图通过 ajax 发出发布请求，在我在web 找到的一些教程代码中

$(document).ready(function()
    $("#create").click(create_note);

);

var create_note = function() 
  var title = $("#title").val()
  var slug = $("#slug").val()
  if (title != "" && slug != "") 
    var data =  title:title, slug:slug ;
    console.log('title='+title);
    console.log('slug='+slug);
    var args =  type:"POST", url:"/create/", data:data, complete:done ;
    $.ajax(args);
  
  else 
    // display failure
  
  return false;
;

url "/create/" 映射到 django 视图

(r'^create/$','notes.views.create_note'),

def create_note(request):
    error_msg = u"No POST data sent."
    if request.method == "POST":
        post = request.POST.copy()
        if post.has_key('slug') and post.has_key('title'):
            slug = post['slug']
            if Note.objects.filter(slug=slug).count() > 0:
                error_msg = u"Slug already in use."
            else:
                title = post['title']
                new_note = Note.objects.create(title=title,slug=slug)
                return HttpResponseRedirect(new_note.get_absolute_url())
        else:
            error_msg = u"Insufficient POST data (need 'slug' and 'title'!)"
    return HttpResponseServerError(error_msg)

当我点击提交按钮时，触发了javascript函数create_note，我得到一个403错误。一定是csrf的问题..

我尝试通过修改 ready 函数来解决这个问题

$(document).ready(function()
        $.ajaxSetup(
        data: csrfmiddlewaretoken: ' csrf_token ' ,
    );
        $("#create").click(create_note);

    );

但它不起作用..我仍然收到403 error

所以，我尝试修改ajax调用中的数据

var create_note = function() 
    var data =  title:title, slug:slug ,csrfmiddlewaretoken: ' csrf_token ';
    ...
    var args =  type:"POST", url:"/create/", data:data, complete:done ;
    $.ajax(args);

;

仍然会导致 403 错误..

请告诉我应该做些什么来纠正这个..我看到了 django doc 关于这个，但我很困惑如何利用它。我应该将整个 jQuery(document).ajaxSend(... 代码复制到我的 javascript 文件中吗..我在这里真的很困惑..

【参考方案1】：

您需要 (as the document you linked to suggests) 复制整个 ajaxSend 方法...

您不需要以任何方式修改它——它是一个完整的解决方案——ajaxSend 方法实际上是ajaxSend 事件的事件处理程序。当您在 jQuery 中使用 .ajax 方法时会触发它。 See the ajaxSend docs here

上述文档中链接的方法将正确的 X-CSRFToken 标头附加到您的 AJAX 请求中。然后，您可以使用第一种方法发送 AJAX 请求。

【讨论】：

谢谢@ManseUK，我也遇到了这个建议..***.com/a/5107878/1291096

?这并不能真正回答 在哪里 的问题是放置 ajaxSend 代码。只是在html文件中？在记事本上？

@bharal 它是一种 JavaScript 方法——所以无论是在你链接到的库中还是在需要它的页面上——问题不在于把它放在哪里——而是如何解决问题....