Btukfyl

I am using a fetch() request from the client to PUT updated user data to the backend, to then be saved into a DB. So far, the all of the route is working fine, verified and tested in Postman.

In this User Update route, there is an if statement that checks for an error when searching for the user in the database, and if this error is thrown, it sends a response of 404 and a message to the client.

When I make the fetch() request from the client to this route, regardless if there is an error, the response is always a status 200, and does not include any response from my route. I need the client to be able to handle the potential errors the routes might produce. For example with this user update route, if the user is not found in the database for whatever reason, an error and message is returned, so the client needs to know this.

Here is some code:

Client-side:

fetch(`http://localhost:3000/users/${userId}`, {

        method: "put",

        headers: {

          Accept: "application/json",

          "Content-Type": "application/json"

        },

        body: JSON.stringify(userData)

      }).then(response => console.log(response))

        .catch(err => console.log(err));

Here in the client, I am using console.log() to visualize everything. When the response returns, I get back:

Response {type: "basic", url: "http://localhost:3000/users/accounts/", redirected: false, status: 200, ok: true, …}

Server-side route controller:

exports.user_update = (req, res) => {

  const { params, body } = req;

  const { userid } = params;



  User.findByIdAndUpdate({ _id: userid }, body, { new: true }, (err, user) => {

    if (err)

      res.send({

        status: 404,

        message:

          "There was an issue finding and updating the user on the server."

      });

    else

      res.send({

        status: 200,

        user

      });

  });

};

Now here on the server, I anticipated the response of the fetch() to be either the 404 error or the 200 success along with their payloads. Neither are returned in a response from the server. Instead as mentioned above, I am getting a generic 200 ok response simply letting me know the fetch() made a connection to the route. This route(along with the others) has been tested in Postman, and all work as anticipated returning the expected responses.

What am I not understanding here? Is my idea of using a fetch() request in this manner wrong? I feel like I might be close, but that's just my ignorant guess. Thank for reading!

According to express documentation you sent status as a field of JSON. To correctly send http status replace your res.send(...) with

res.status(404).send("There was an issue finding and updating the user on the server.");

and

res.send(user);

You are sending the status field inside your payload, which is not parsed by fetch API.

To solve this you could something as below

exports.user_update = (req, res) => {

  const { params, body } = req;

  const { userid } = params;



  User.findByIdAndUpdate({ _id: userid }, body, { new: true }, (err, user) => 

  {

    if (err)    

      res.status(404).send({

        message: "There was an issue finding and updating the user on the server."

      });

    else

      res.status(200).send({

        user

      });



  });

};

I figured out the solution.

The fetch request was wrong, here is the update:

fetch(`http://localhost:3000/users/${userId}`, {

        method: "put",

        headers: {

          Accept: "application/json",

          "Content-Type": "application/json"

        },

        body: JSON.stringify(userData)



      }).then(response => response.json())

        .then(response => console.log(response))

        .catch(err => console.log(err));

I had to call response.json() to parse the response as a JSON object.