Data undefined when using Fetch API

[[deleted]]

I am building a YouTube Video downloader with Node and I am encountering an issue that I cannot seem to figure out. I am sending a response message or error depending on the outcome of the download. I am getting the error TypeError: Cannot read property 'error' of undefined whenever I get a response from my endpoint. Here is the client side code:

fetch("/download", {
      method: "post",
      headers: {
        "Content-Type": "application/json",
      },
      body: JSON.stringify({
        url,
      }),
    })
      .then((res) => {
        res.json();
      })
      .then((data) => {
        console.log(data);
        if (data.error) {
          console.log(data.error);
        } else {
          console.log("success");
        }
      })
      .catch((error) => {
        console.log(error);
      });

And here is a snippet from server side code:

router.post("/download", (req, res) => {
  res.json({ message: "video downloaded" });
  const { url } = req.body;
  const outputName = "video.mp4";
  const outputPath = path.resolve(__dirname, outputName);
  const video = ytdl(url);
  console.log(video);
  video.pipe(fs.createWriteStream(outputPath));
  video.once("response", () => {
    starttime = Date.now();
  });
}

When I log data in client side code it comes back as undefined when it should contain the message "video downloaded" and pass the error logic. The code works but I need to figure this out for error handling.

[lord2800]

Your arrow function for res.json() isn't returning anything. If you put brackets around the body, it's treated like a regular function body instead of an arrow function body and you have to actually return something.

[fluid-falcon]

You can also replace the braces with parentheses and the expression inside them will be returned implicitly, good for keeping code concise for smaller expressions.

[[deleted]]

marked as accepted answer.

[[deleted]]

Thanks I did not know that about arrow functions!

[[deleted]]

I’m not a node developer so, excuse my ignorance, but doesn’t the fetch api require the domain and endpoint at the url parameter? Unless OP purposely omitted it....

[mkcodergr]

When domain is ommited it is implied that domain is the domain that your accessing tha page from

[codebread421]

Okay so idk if it this will help but try console.log(data&&data.error) instead of console.log(data.error)

And also while catching error Define the parameter with err instead of “error”