在 Fetch JS for Django 中添加 CSRF

3回答

慕无忌1623718

我在一个类似的项目中遇到了几个小时的问题。我终于找到了解决方案！我希望这个信息帮助。我正在使用的脚本不在 django 模板上，所以使用csrfmiddlewaretoken: '{{ csrf_token }}'对我不起作用。我在"credentials": 'same-origin'上面列出的，而且还包括"X-CSRFToken": getCookie("csrftoken")了，它使用了底部包含的功能。这是我需要的第二点。所以你的代码应该是这样的：fetch("http://127.0.0.1:8000/api/endpoint", {  method: "POST",  body: $("#form").serializeArray(),  credentials: 'same-origin',  headers: {      "X-CSRFToken": getCookie("csrftoken")  }}).then(function(data) {}).catch(err => console.log(err));然后你需要添加这个函数：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;}当然，该方法必须在同一页面上。取自 Django 文档。 https://docs.djangoproject.com/en/1.11/ref/csrf/#ajax我从这篇文章中找到了这些信息：来自用户Ska的https://stackoverflow.com/a/43943556

紫衣仙女

在你的身体内部，你可以像这样在你的 ajax 请求中传递 csrf 令牌：body : {   // Other stuff   csrfmiddlewaretoken: '{{ csrf_token }}'}这应该可以解决您的问题。编辑：默认情况下，Fetch 在其请求中不包含 Cookie。为此，您需要在您的 fetch 请求中添加这一行作为 on 选项：credentials : 'include' // For Corscredentials : 'same-origin' // For same origin requests 

慕姐8265434

就我而言，我使用的是纯 Javascript 和 Django。我必须在我的 HTML 布局中隐藏一个 {% csrf_token %} 以便我可以在我的 fetch 请求中访问它，如下所示：HTML 模板：<head>   <title>Page title</title>  {% csrf_token %}</head>index.js：csrf_token = document.getElementsByName('csrfmiddlewaretoken')[0].valuefetch(`${url}`, {        method : 'put',        body : JSON.stringify(your_dat),        headers: { "X-CSRFToken": csrftoken },        credentials : 'same-origin',    })它可能不是最漂亮的代码