POST请求后端端点出现400（Bad Request）错误，求排查解决

以下是出现错误的代码片段：

const handleTokenRequest = async () => {
    try {
      const response = await axios.post(
        "backend endpoint here",
        {
          username: 1,
          password: 1,
          phone: formData.phoneNumber,
          verification_code: otp,
        },
        {
          headers: {
            "Content-Type": "application/json",
          },
        }
      );

      if (response.status === 200) {
        const accessToken = response.data.access;
        const refreshToken = response.data.refresh;

        loginUser(accessToken, refreshToken);
      } else {
        console.error("Token request failed. Something went wrong!");
      }
    } catch (error) {
      console.error("Error during token request:", error);

      if (error.response && error.response.status === 404) {
        console.error("Invalid verification code or user not found");
      }
    }
  };

遇到的错误信息：

• POST 'backend endpoint' 400 (Bad Request)
• AxiosError: Request failed with status code 400（完整错误栈见问题描述）

可能的原因及解决方法 #

• 请求参数不符合后端校验规则
  代码中username和password被设置为1，大概率不符合后端对字段类型（比如要求字符串）或内容的校验要求；另外phone的格式是否符合后端定义的手机号规则、verification_code的长度/格式是否匹配后端生成的验证码，都是常见的校验失败点。
  解决：将username和password替换为符合后端要求的有效值，若这两个字段非必填，可确认后端是否允许省略后再调整参数结构。

• 未获取后端返回的具体错误详情
  当前代码仅捕获了状态码，未打印error.response.data中的内容，而后端通常会在该字段返回具体的错误原因（比如"username必须为字符串"、"验证码错误"等），这是定位问题最直接的依据。
  解决：修改catch块，添加对错误详情的打印：

  catch (error) {
    console.error("Error during token request:", error);
    if (error.response) {
      console.error("后端返回错误详情:", error.response.data); // 新增此行
      if (error.response.status === 404) {
        console.error("验证码无效或用户不存在");
      } else if (error.response.status === 400) {
        console.error("请求参数不符合后端要求");
      }
    }
  }
  

• 请求端点URL错误
  确认实际使用的后端端点URL是否正确，包括协议（http/https）、域名、路径是否与后端提供的完全一致，避免拼写错误或路径缺失（比如遗漏/api前缀）。

• 请求头或内容类型不匹配
  虽然设置了Content-Type: application/json，但需确认后端是否确实接受JSON格式的请求体，部分后端可能要求表单格式（application/x-www-form-urlencoded），或需要额外的请求头（比如跨域相关的头、自定义认证头）。

内容的提问来源于stack exchange，提问作者timur.frontend