无法使用 axios 检索 API 数据答案

【问题标题】：Unable to retrieve API data using axios无法使用 axios 检索 API 数据
【发布时间】：2022-01-26 21:28:27
【问题描述】：

我正在尝试使用 API 构建一个简单的登录，但总是遇到错误

import React from "react";
import { useState } from "react";
import axios from "axios";
import { useNavigate } from "react-router-dom";

export default function Login() {
  const navigate = useNavigate();
 
  const [formData, setFormData] = useState({
    uid: "",
    password: "",
    blocked: 0
  });
 

  const handleSubmit = (e) => {
    e.preventDefault();
    console.log(formData);
     const data = JSON.stringify(formData);
     console.log(data);

    axios
      .post("https://myphysio.digitaldarwin.in/api/login/", data)
      .then(function (response) {
        console.log(response);
        console.log("Successfully Logged in ");
    
       navigate("/success");
      
      })
      .catch(function (error) {
        console.log(error);
      });
  };
 
  return (
    <form onSubmit={handleSubmit}>
      <h3>Login</h3>

      <div className="form-group">
        <label>uid Name</label>
        <input
         
          name="uid"
          className="form-control"
          placeholder="Enter your uid Name"
          value={formData.uid}
          onChange={(e) => setFormData({ ...formData, uid: e.target.value })}
        />
      </div>

      <div className="form-group">
        <label>Password</label>
        <input
          type="password"
          name="password"
          className="form-control"
          placeholder="Enter password"
          value={formData.password}
          onChange={(e) =>
            setFormData({ ...formData, password: e.target.value })
          }
        />
      </div>

      <button type="submit" className="btn btn-primary btn-block">
        Submit
      </button>
    </form>
  );
}

我一直面临的错误是 console log of error

POST https://myphysio.digitaldarwin.in/api/login/500（内部服务器错误）

错误：网络错误在 createError (createError.js:16:1) 在 XMLHttpRequest.handleError (xhr.js:117:1)

POST https://myphysio.digitaldarwin.in/api/login/ net::ERR_CONTENT_LENGTH_MISMATCH 500（内部服务器错误）

【问题讨论】：

为什么您的登录网址显示媒体类型和内容？它不应该显示用户名/电子邮件和密码吗？

标签： reactjs django api django-rest-framework axios

【解决方案1】：

你所有的错误都来自后端，所以我建议你在 django 部分发布一个问题（我查看了链接，我是 django 框架，所以我假设你使用 django）。也许您不想对 formData 进行字符串化（通常在 post 请求中发送 json 是很常见的）。

【讨论】：

不是anwser，而是评论。