Why does POST 'backend endpoint' 400 (Bad Request) error is occured?

Question

the error is catching in this piece of code:

 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");
      }
    }
  };

first issue: POST 'backend enpoint' 400 (Bad Request)

second issue:

Error during token request: AxiosError {message: 'Request failed with status code 400', name: 'AxiosError', code: 'ERR_BAD_REQUEST', config: {…}, request: XMLHttpRequest, …} code : "ERR_BAD_REQUEST" config : {transitional: {…}, adapter: Array(2), transformRequest: Array(1), transformResponse: Array(1), timeout: 0, …} message : "Request failed with status code 400" name : "AxiosError" request : XMLHttpRequest {onreadystatechange: null, readyState: 4, timeout: 0, withCredentials: false, upload: XMLHttpRequestUpload, …} response : {data: {…}, status: 400, statusText: 'Bad Request', headers: AxiosHeaders, config: {…}, …} stack : "AxiosError: Request failed with status code 400\n at settle (http://localhost:5173/node_modules/.vite/deps/axios.js?v=08b8f510:1204:12)\n at XMLHttpRequest.onloadend (http://localhost:5173/node_modules/.vite/deps/axios.js?v=08b8f510:1434:7)" [[Prototype]] : Error

i tried to fix this issue by myself but i couldn't, i had asked from chatgpt about it too but it was without results too, asked from blackbox ai and it didn't help too

Answer 1

Have a try of setting withCredentials:true in the axios request.