'Unsupported content type: multipart/formdata at Busboy.parseHeaders - Node Formdata

I'm trying to do an update action in the backend with node but I can't do it, when I try with Postman it works, but when I do the code it doesn't.

So here is how I handle update in Node:

router.put(
  '/update/:id',
  passVerify,
  upload.array('images[]'),
  async (req, res) => {
    try {
      const data = req.body;
      let images = [];
      let image_index = 0;

      console.log("data:", data)

      if (req.files)
        req.files.forEach((img) =>
          images.push({
            id: ++image_index,
            path: img,
          })
        );
        console.log("files:", images)

      const old = await Order.findById(req.params.id);
      console.log("old:", old)
      const update = { ...old._doc, ...data, images };
      console.log("update:", old)

      const order = await Order.findByIdAndUpdate(req.params.id, update, {
        new: true,
      });

      if (order)
        res.status(200).send({
          success: true,
          message: 'The order was updated.',
          data: order,
        });
    } catch (err) {
      res.status(500).send({
        success: false,
        message: err,
      });
    }
  }
);

And here is my function to call the update api:

export const updateOrder = createAsyncThunk(
  '/orders/update',
  async ({ token, id, body }) => {
    const requestOptions = {
      method: 'PUT',
      headers: {
        'Content-Type': 'multipart/formdata',
        Authorization: 'Bearer ' + token,
      },
      body: JSON.stringify(body),
    };
    try {
      const response = await fetch(
        `${api}/orders/update/${id}`,
        requestOptions
      );
      const data = await response.json();
      console.log(data)
      return data;
    } catch (error) {
      console.log(error);
    }
  }
);

And this is how i Call the update function:

 <button
                onClick={() => {
                  var formdata = new FormData();
                  formdata.append('parts', data.parts);
                  formdata.append('working_hours', data.working_hours);
                  formdata.append('other', data.other);
                  
                  dispatch(
                    updateOrder({
                      token: auth.token,
                      id: order.order._id,
                      body: formdata,
                    })
                  );
                }}
                className={styles.button}>
                <UpdateClientIcon />
                <p className={styles.button_add}>Update</p>
              </button>

And this Is what I get in node console: Error: Unsupported content type: multipart/formdata at Busboy.parseHeaders, and this is weird this happens when i use multipart/formdata, if i ussed application/json and send normal date it does the update without problems.



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source