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

时间:2020-11-10 12:52:05

标签: javascript reactjs axios django-cors-headers

我在postman上对此URL http:// localhost:8000 / api / auth / users /发出了发布请求。成功了但是,在我的反应前端尝试相同的操作会产生400(错误的请求错误)。它还显示未捕获(承诺)错误:请求失败,状态码为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服务器日志:

A Console log

Network part 1

Network part 2

Network part 3

Log of Django server

2 个答案:

答案 0 :(得分:1)

使用以下代码:

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)

答案 1 :(得分:1)

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

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

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