when I send a request in the front I get error of uncaught in (promise) request failed with status 404 it was working but when I put other function function in the same page like login or get user ou update, I started to get this error

import axios from "axios";
import { useState } from "react";

export default function Formulario() {
  const [username,setUsername] = useState("")

  const handleSubmit = async (e) => {
    e.preventDefault();
    const res = await axios("/users/register", {
      username,
    });
    
      console.log(res)
    
  };

  return (
    <form onSubmit={handleSubmit}>
      <label> Username</label>
      <input type="text"
      onChange={(e) =>setUsername(e.target.value)}/>
      <button type="submit">Register</button>
      </form>
    )
} 

this is the api

const router = require("express").Router();
const User = require("../models/User");

// postando username

router.post("/register", async (req, res) => {
    try{
        const newUser = new User({
            username: req.body.username
        });

        const user = await newUser.save();
        res.status(200).json(user);


    } catch (err) {
        res.status(500).json(err);
    }
});
        
module.exports = router
```

CodePudding user response：

By, the looks of it, I think your axios instance is not making the react to a valid url. Unless your have the baseUrl property set on your axios

1. Check the browser's network tab to see if your app (react) is making a request to the correct endpoint (same as postman endpoint).

CodePudding user response：

the problem was in the app.use in my index.js I was using

app.use("api/users", usersRoute);

and the correct is

app.use("/api/users", usersRouter);

thanks for helping