我正在开发一个项目，该项目使用 Django REST 框架作为后端（比方说 atapi.somecompany.com但有一个 React.js 前端（at www.somecompany.com），它不是由 Django 提供的，它发出 AJAX 请求。

因此，我不能使用 Django 的传统方法让模板包含这样的 CSRF 令牌 <form action="." method="post">{% csrf_token %}

我可以向 Django REST Framework 的api-auth\login\url发出请求，它将返回此标头： Set-Cookie:csrftoken=tjQfRZXWW4GtnWfe5fhTYor7uWnAYqhz; expires=Mon, 01-Aug-2016 16:32:10 GMT; Max-Age=31449600; Path=/-但我无法检索此 cookie 以与我的 AJAX 请求一起发回X-CSRFToken（我的理解是单独的子域），并且它没有似乎是自动包含的。

这是我的相关代码：

// 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;
}

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)) {
            xhr.setRequestHeader("X-CSRFToken", getCookie('csrftoken'));
        }
    }
});

当页面加载时，我调用它以确保我有一个令牌：

$.ajax(loginUrl, { method: "OPTIONS", async: false })
    .done(function(data, textStatus, jqXHR) {
        console.log(jqXHR)
        app.csrftoken@ = $.cookie("csrftoken")
        console.log($.cookie("csrftoken"))
        console.log(app.csrftoken)
    })
    .fail(function(jqXHR, textStatus, errorThrown) {
        console.log(jqXHR)
    });

这并不完全干净，但我还没有向自己证明这个概念。

当前端和后端位于不同的端口/域时，验证/防止 CSRF 的“正确”方法是什么？