Django React Axios

Question

我正在尝试使用React和Axios向Django服务器发出一个发布请求.但是,我在服务器端获得了重定向302.

刚刚关注这篇文章中的所有建议CSRF与Django,React + Redux使用Axios 失败:(

然而,什么是迄今为止我所做的是以下几点:周六默认Axios公司CookieName和HeaderName(在JavaScript端):

axios.defaults.xsrfHeaderName = "X-CSRFToken";
axios.defaults.xsrfCookieName = "XCSRF-Token";

得到了这个settings.py:

CSRF_COOKIE_NAME = "XCSRF-Token"

以下是帖子请求的样子:

axios(
    {
        method: 'post',
        url: `/api/${selectedEntryType}_entry`,
        data: {
            "test": "test"
        },
        headers: {
            'X-CSRFToken': document.cookie.split('=')[1],
            'X-Requested-With': 'XMLHttpRequest',
            'Content-Type': 'application/json',
        }
    }
)

我尝试的另一件事是从Django rest api UI发出post请求:

它确实成功.

在请求头,当我提出请求从UI和JS的唯一区别是: Accept,Content-Length,和Referer,我不明白他们怎么可能会有问题.

请帮忙.

Answer 1

通过更改url:'/en/api/endpoint/'我发布的url()来管理修复它,因为显然是为了POST请求:

您通过POST调用此URL,但URL不以斜杠结尾,并且您设置了APPEND_SLASH.在保持POST数据时,Django无法重定向到斜杠URL.将表单更改为指向127.0.0.1:8000/en/api/endpoint/(注意斜杠),或在Django设置中设置APPEND_SLASH = False

在那之后我开始得到Forbidden 403,但通过添加:

from django.views.decorators.csrf import csrf_protect
from django.utils.decorators import method_decorator

@method_decorator(csrf_protect)
def post(self, request):
    return Response()

并且还将JS中的默认值更改为:

axios.defaults.xsrfHeaderName = "X-CSRFToken";
axios.defaults.xsrfCookieName = "csrftoken";

除去CSRF_COOKIE_NAME = "XCSRF-Token"从settings.py.

有效.

希望这有助于将来的某些人.