Django rest api 使用 javascript 客户端在 post 请求上导致 csrf 问题答案

【问题标题】：Django rest api using javascript client causing csrf issues on post requestsDjango rest api 使用 javascript 客户端在 post 请求上导致 csrf 问题
【发布时间】：2015-02-20 13:25:44
【问题描述】：

我正在使用this 和this 在我的rest api 上发布一些数据。但我收到了错误的请求 (400) 响应。

我的一段代码

var dataTask = {};
var dataPeri = {};
var csrf;
var that = this;
var date = new Date();
var dateString;
dateString = date.toJSON().slice(0, 10);
dataPeri['date'] = dateString;
dataPeri['customer'] = customerId;
csrf = $('input[name="csrfmiddlewaretoken"]').val();
console.log('csrf:'+csrf);
console.log(dataPeri); //The objects seems fine with date at the right format and customerId a number
$.ajaxSetup({
   beforeSend: function(xhr, settings){
       if (!this.crossDomain){
           xhr.setRequestHeader("X-CSRFToken", csrf);
       }
   }
});
$.ajax({
    dataType:'json',
    type: 'post',
    url: '/crm/api/periodontogramms/',
    data:JSON.stringify(dataPeri),
    success: function (data, textStatus, jqXHR){
        alert("New Periodontogramm saved successfully");
        console.log("Periodontogramma "+ data);
        that.periodontogramms.push(data);
    },
    error: function (jqXHR, textStatus, errorThrown){
        alert(errorThrown);
    }
});

我不知道错误是什么，因为错误没有其他消息。我将 Json 送回。（使用 JSON.stringify）。我应该发送其他东西吗？可能是导致问题的 dateString 吗？在我的可浏览 Api 上以以下格式发布我使用日期的内容：YYY-MM-DD。这就是我从date.toJSON.slice(0, 10) 得到的。如果这是一个 csrf 问题，我不应该收到一条禁止消息（403）

【问题讨论】：

标签： javascript django django-rest-framework django-csrf

【解决方案1】：

这最初是由@Apostolos在问题中回答的

在我删除 JSON.stringify 并发送纯 javascript ojbect 后它工作了。

但是没有解释为什么。问题是您将 JSON 数据（使用 JSON.stringify 编码）作为字符串发送到 API，但 API 给人的印象是您发送的是表单编码数据。

您在 $.ajax() call 中使用了一些参数，但您遗漏了一些重要的参数。

dataType 参数根据正在发送的 Accept 标头告诉 jQuery 期望返回的数据类型。在大多数情况下，这是json，默认情况下，jQuery 会根据响应的内容进行智能猜测。这通常是正确的，但帮助它并没有什么坏处。

contentType 参数告诉 jQuery 什么数据类型被发送到服务器。默认为application/x-www-form-urlencoded; charset=UTF-8，在发送 JSON 数据时，您必须将其设置为application/json。这很重要，否则 jQuery 将不知道如何处理您提供的 JSON 字符串，并且 API 将不知道如何处理格式错误的格式编码数据。

data 参数告诉 jQuery 哪些数据要发送到服务器。使用默认的contentType，这将接受一个表单编码的字符串或一个包含键 -> 值对的字典，这些对应该是表单编码的。当 contentType 被覆盖时，jQuery 期望此处发送的数据应该与必须发送到服务器的数据完全匹配，在您的情况下为 JSON 字符串。

我还建议您使用浏览器的开发人员工具来阅读响应的正文，因为这应该告诉您您发送的请求存在问题。

【讨论】：