Jquery和Django CSRF令牌

Question

我有2个html页面.

父页面和子页面.子页面包含一个提交按钮,该按钮在父页面上运行代码以提交Ajax消息.

我使用$ .load()方法加载子页面,然后当单击该按钮时,它运行$ .ajax .POST方法.此post方法仅将JSON字符串传递给Python代码.

当我在任何浏览器上执行此操作,除了IE它工作正常.但是当我在IE中运行此代码时.我得到关于CSRF令牌的Python/Django错误.

我认为原因是因为子页面只是刷新当前页面本身,并且正在运行服务器端代码.

有谁知道我应该如何让这个工作.

干杯,

Answer 1

您没有使用POST传递csrf令牌.尝试做我在数据中所做的事情.这是获取csrf标记(或您自己的方法)并在您的参数中传递它.

$.ajax({
    url : url,
    type: "POST",
    data : {csrfmiddlewaretoken: document.getElementsByName('csrfmiddlewaretoken')[0].value},
    dataType : "json",
    success: function( data ){
        // do something
    }
});

Answer 2

如果您要发送POST请求正文,则可能更容易将csrf标记添加为请求标头.我发现这种方法更容易阅读,因为它不会使用令牌混淆请求体.大多数AJAX请求将根据Django文档的建议将csrf令牌作为标头发送.

function startTest(testId) {
  var payload = JSON.stringify({
    test_id : testId
  });
  $.ajax({
    url: "/test-service/",
    method: "POST",
    headers: {'X-CSRFToken': '{{ csrf_token }}'},
    data: payload,
    dataType: "json"
  }).done(function(response) {
    console.log(response.id + " " + response.name);
  }).fail(function (error) {
      console.log(error);
  });
}

Answer 3

来自CSRF和AJAX 的文档:

CSRF令牌也存在于DOM中,但只有在模板中使用csrf_token明确包含时才会出现.cookie包含规范令牌; CsrfViewMiddleware更喜欢cookie到DOM中的令牌.无论如何,如果令牌存在于DOM中,您将保证拥有cookie,因此您应该使用cookie!

示例 (也来自文档)

// 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');

或者可以使用任何其他与cookie交互的方式.