Question

在我的场景中，我正在我的React前端（http://localhost:3000/submit）中使用一个表单发布到我的URL http://localhost:8000/api/submit/

但是，我收到了以下回复：

“详细信息”：“ CSRF失败：CSRF令牌丢失或不正确。”

我的班级观点是这样的：

from rest_framework.views import APIView
from rest_framework.parsers import MultiPartParser, FormParser

class Submit(APIView):
    parser_classes = (MultiPartParser, FormParser)
    def post(self, request, *args, **kwargs):
        #custom post

我有两个问题：

我如何装饰dispatch（）以免除csrf？
如何为前端提供CSRF？

**

通过Risadinha解决：

**

import cookie from "react-cookies";

...

<input
 type="hidden"
 value={cookie.load("csrftoken")}
 name="csrfmiddlewaretoken"
/>

Answer 1

您需要将cookie和标头设置为CSRF令牌，以便在初始调用期间传输，从而加载React页面。

基本上，您需要读取从Django服务器发送的cookie“ csrftoken”的值，并将其设置为react应用中所有AJAX发布请求的标头“ X-CSRFTOKEN”的值。一般情况下最好做的最好（例如index.js）。

在React中使用axios（我们正在使用graphql）客户端的示例：

import axios from "axios";
import cookie from "react-cookies";

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

your_client.setHeaders({"X-CSRFTOKEN": cookie.load("csrftoken")});

没有ajax，将cookie的值添加到这样的表单中-如果您不能使用模板标签{% csrf_token %}（以react形式）：

<input type="hidden" name="csrfmiddlewaretoken" value="{value-of-the-cookie}" />

Answer 2

这似乎有点hacky，但是您可以使用django.middleware.csrf.get_token()方法在视图中获取csrf令牌。所以我会这样说：

from django.http import JsonResponse

def get_csrf(request):
    csrf_token = django.middleware.csrf.get_token()
    return JsonResponse({'csrf_token':csrf_token})

您当然希望保护此请求，以便任何人都无法获取令牌。无论如何，这似乎打败了它的目的...

Django后端，React前端和CSRF发布

通过Risadinha解决：

2 个答案: