在 Django 中使用 Axios 和 CORS 获取 POST 请求的错误请求并做出反应

Posted 2023-03-03

【中文标题】在 Django 中使用 Axios 和 CORS 获取 POST 请求的错误请求并做出反应

【英文标题】：Getting Bad request for POST request using Axios and CORS in Django and react app

【发布时间】：2021-02-22 09:55:56

【问题描述】：

我在 postman 上向这个 url http://localhost:8000/api/auth/users/ 发出了 post 请求。它是成功的。但是，在我的 react 前端尝试相同的操作会产生 400（错误请求错误）。它还说 Uncaught (in promise) Error: Request failed with status code 400

这是我的代码 AuthAPi.js：

import API from "./API"; 

const config = 
  headers :
    "Content-Type": "application/json",
   


const signIn = (email, password) => API.post("/auth/users/", 
  params : 
    email : email,
    password : password 
    
  ,
,
  config
)
.Catch((error) => console.log( error.message ) );

export  signIn ;

和 API.js

import axios from 'axios';

export default axios.create(
  baseURL: `http://127.0.0.1:8000/api`,
  headers: 
    "Content-type": "application/json"
  
);

我尝试了几个没有解决方案的链接。我很乐意在这里获得帮助。

下面是控制台日志、网络日志和 Django 服务器日志的截图：

【问题讨论】：

你能分享你的 Django 代码吗？错误请求 (400) 错误不是由 CORS 政策引起的。

Django 代码的哪个部分或文件？

【参考方案1】：

params是要随请求一起发送的URL参数

您使用的post实例方法的签名是axios#post(url[, data[, config]])，因此您应该这样提出您的请求

const signIn = (email, password) => API.post("/auth/users/", 
    email : email,
    password : password 
  ,
  config
)

【讨论】：

谢谢，我试过这个方法还是不行。

【参考方案2】：

使用此代码：

API.post("/auth/users/", 
  params : 
    email : email,
    password : password 
  

您正在将一个包含对象的对象作为发布数据传递给 axios。 Axios 不介意，但你的服务器不喜欢。相反，请尝试：

API.post("/auth/users/", 
  email : email,
  password : password 
, config)

这应该可行。如果要作为单个对象传入，则需要在 api 调用之外声明：

let postData = 
  email: email,
  password: password

API.post("/auth/users/", postData, config)

【讨论】：

谢谢，这个方法我试过了，还是不行。

是的，还是一样

我们需要查看响应和请求对象。您可以在开发工具的网络选项卡中找到它们。使用屏幕截图更新您的问题或复制整个文本（标题和正文数据）。这样我们就可以进一步排除故障。

谢谢，我刚刚添加了图片@Nick Dawes