0

hoping you all can help me solve this mystery. I’ve created an endpoint for my API:

apiRouter.get("/username", async (req, res) => {
  const { username } = req.body;
  try {
    const user = await getUserByUsername(username);

    res.send({ message: "This is your user", user });
    console.log("this is user", user);
  } catch (error) {
    throw error;
  }
});

It’s a GET route that should send back the a message and a user object in this fashion when the user interacts with this url path:

 http://localhost:3000/api/users/username 

When I access the endpoint via, Postman, I get back both the message and the user object. Something that looks like this:

{
    "message": "This is your user",
    "user": {
        "customer_id": 5,
        "first_name": "Jessica",
        "last_name": "Blue",
        "email": "baker@space.com",
        "username": "jess1",
        "password": "1234",
        "address_1": "123 pretty lane",
        "address_2": "Apt 31",
        "city": "Riverside",
        "state": "California"
    }
}

However, when I access the route, via my frontend, the message comes back but not the user. I’m using the following method to make the call to the server:

export async function getUserByUsername(username) {
  try {
    const { data } = await axios.get("/api/users/username", {
      username,
    });
    console.log(data);
    return data;
  } catch (error) {
    throw error;
  }
}

I'm really not sure why the user isn’t being sent back with the response. The route works, I’m just not getting back my expected response. I’ve spent a couple hours trying to find a fix with no luck. Any help would be greatly appreciated.enter image description here

Tee K.
  • 3
  • 2

3 Answers3

3

Currently you can't send a body with get requests in most browsers. so you've two options:

change your backend method to POST:

apiRouter.post("/username", async (req, res) => {
  const { username } = req.body;
  .
  .
  .
}

and use axios like this:

const { data } = await axios.post("/api/users/username", {
  username,
});

or if you want to stick with the get method accept the username as a query or a param:

apiRouter.get("/username/:username", async (req, res) => {
  const { username } = req.params;
  .
  .
  .
}

and use axios like this:

const { data } = await axios.get(`/api/users/username/${username}`);
    

or

apiRouter.get("/username", async (req, res) => {
  const { username } = req.query;
  .
  .
  .
}

and use axios like this:

const { data } = await axios.get(`/api/users/username`, { params: { username } });
Abbas
  • 600
  • 1
  • 12
2

You are using a GET request with body. Although it's possible, but not advisable, to do so when you create your own request through Postman, axios probably ignores the body param when using a GET request and doesn't include it in the request.

So my suggestion would be to place the username param in the request params (req.params) or request query (req.query) and try to get it from there.

You can find more details about req.params: here, and about req.query: here.

Kapobajza
  • 823
  • 6
  • 12
0

I think it's might be because of the async await approach you're using in the endPoint it self, can you try running this line in your terminal: npm install express-async-errors --save after that go to index.js (your backend route file) and add this line over here: import 'express-async-errors'; and try again, Hopefully, this will solve your issue

kyrolos magdy
  • 190
  • 1
  • 2
  • 13