POST 400：错误请求 - 使用 Django REST API 和 React答案

【问题标题】：POST 400: Bad request - Using Django REST API and ReactPOST 400：错误请求 - 使用 Django REST API 和 React
【发布时间】：2020-03-23 16:20:34
【问题描述】：

我是网络开发的新手，所以请提前原谅我的无知。

我正在使用 React 尝试使用这种方法将数据发布到由 Django 管理的服务器端点：

sendData(data) {
  const url = "http://127.0.0.1:8080/api/filtros/1/";
  const requestOptions = {
    method: "POST",
    headers: {
      Accept: "application/json",
      "Content-Type": "application/json"
    },
    body: JSON.stringify(data)
  };
  fetch(url, requestOptions);
}

在 NavDropdown React 组件的 onClick 上：

<NavDropdown.Item
  key={item.id}
  onClick={() =>
    this.sendData({
      id: 0,
      dimension_id: dimension.id,
      item_id: item.id,
      usuario_id: 1
    })
  }
>
  {item.descripcion}
</NavDropdown.Item>

这就是我使用 Django 在路由器上注册 url 的方式：

router.register('api/filtros/1', FiltroUsuariosViewSet, 'filtro')

我的 Django ModelViewSet 如下所示：

class FiltroUsuariosViewSet(viewsets.ModelViewSet):

    queryset = FiltroUsuarios.objects.all()
    permission_classes = [
        permissions.AllowAny
    ]
    serializer_class = FiltroUsuariosSerializers

我的 Django 序列化器看起来像这样：

class FiltroUsuariosSerializers (serializers.ModelSerializer):
    class Meta:
        model = FiltroUsuarios
        fields = ('id', 'dimension_id', 'item_id', 'usuario_id')

    def create(self, validated_data):
        post = FiltroUsuarios.objects.create(**validated_data)

当我点击组件时，我得到这个： POST http://127.0.0.1:8080/api/filtros/1/ 400 (Bad Request) 显然错误是在获取请求上。

你们有什么想法吗？

提前非常感谢！

【问题讨论】：

打开开发工具并在您的网络选项卡中检查您发送到后端的有效负载是什么。 400 Bad Request 表示您发送的数据不正确。
我同意@Kox，可能是因为您发送的数据不是 Django REST API 所期望的。
我在使用 JQuery 时遇到了类似的问题，删除 headers: { Accept: "application/json", "Content-Type": "application/json" }, 并重试，它对我有用，不知道为什么

标签： django reactjs django-rest-framework bad-request

【解决方案1】：

在连接 Django 和 React 时了解和消除 400 Bad Request 错误的最佳方法是在开发模式下运行 Django，然后在发送请求时启动浏览器的 Network 选项卡。

切换到 Network -> Response 标签并致电sendData()。由于您在 Django 的开发服务器上运行，因此您将在 400 Bad Request 错误中获得特定异常。要模拟这一点，请参阅下面的屏幕截图并注意：

{"user": ["类型不正确。预期的pk值，收到的str。"]}

回到您的问题，您的.sendData() 中有以下内容：

x = {
      id: 0,
      dimension_id: dimension.id,
      item_id: item.id,
      usuario_id: 1
    }

然后你打电话给JSON.stringify()。如果dimension.id 和item_id 都是整数（一个合理的假设），那么您将以下内容作为有效负载传递：

JSON.stringify(x)
# returns:
"{"id":0,"dimension_id":1,"item_id":2,"usuario_id":3}"

您的 FiltroUsuarios 的 Django 模型定义了这些列/字段，因此您现在需要检查您的模型和 FiltroUsuariosSerializers 这些是映射到这些列的预期值/值类型。

【讨论】：