在 JSON 请求中发送 csrf_token（无 ajax）

Question

我正在尝试使用 csrf 令牌向我的 Django 应用程序发送 JSON 请求，但我不知道如何。 我已经将令牌放入一个可以引用的变量中，但我不知道如何通过 JSON 请求发送它。 我已将'csrfmiddlewaretoken': csrftoken添加到 JSON.stringify 部分的正文中，但我仍然收到错误消息，提示 403 Forbidden。 有人可以帮我吗？ 谢谢！ （对不起，代码上的奇怪缩进）

Javascript 文件：

fetch('/update', {
          method: 'PUT',
          body: JSON.stringify({
            'csrfmiddlewaretoken': csrftoken,
            'liked': true,
            'post_id': parseInt(button.dataset.post_id)
          })
        })

视图.py：

data = json.loads(request.body)
        try:
            content = data.get('content')
        except:
            JsonResponse({'error': 'content required'}, status=400)
        try:
            id = data.get('id')
            post = Post.objects.get(id=id)
        except:
            JsonResponse({'error': 'post not found'}, status=400)
        if request.user == post.user:
            post.content = content
            post.save()
            return JsonResponse({'message': f'received: {content}'})
        return JsonResponse({'error': "can't edit this user's posts"}, status=403)

Answer 1

首先，来自 Andrea 和 Gabcvit 的一些代码将不胜感激。

编辑 Farhan 的答案：您需要手动检索 csrf 令牌，因为 javascript 中没有默认值供您这样做。 您可以通过以下方式做到这一点：

import jQuery from 'jquery';  // important dependency

function getCookie(name) {
  let cookieValue = null;
  if (document.cookie && document.cookie !== '') {
    let cookies = document.cookie.split(';');
    for (let i = 0; i < cookies.length; i++) {
      let cookie = jQuery.trim(cookies[i]);
      if (cookie.substring(0, name.length + 1) === (name + '=')) {
          cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
          break;
      }
    }
  }
  return cookieValue;
}

var csrftoken = getCookie('csrftoken');

如果 React 没有收到 Django 的 csrf 令牌（这发生在我的例子中），您需要在视图上方添加以下代码：

@method_decorator(ensure_csrf_cookie, name='dispatch')
class UserLoginView(View):
    # ...

如果您需要更多帮助， 这篇 MDN 文章将为您提供帮助。

Answer 2

首先要获取csrf，您可以使用以下代码

从此链接获取代码 clickme 1

现在我们得到了 csrf，将这行代码添加到 fetch 的标题中

'X-CSRFToken':csrftoken,