I have a button where the logged user can download a file which is stored in the database and is fetched by react from node js/express js. Without authentication I can easily do that by just an tag. But with authentication I am struggling a lot.

React:

const handleDownload = async () => {
    const result = await fetch (process.env.REACT_APP_BACKEND_URL + `/files/download/${props.id}`, {
      headers: {'Authorization': auth.token}
    });

    const responseData = await result.json();
    return responseData;
  }

return (
  <button onClick={handleDownload}>Download File</button>
)

Express js:

router.get('/download/:fid', filesControllers.downloadFile);

const downloadFile = async (req, res, next) => {
  const fileId = req.params.fid;
  let filePost;
  try {
    filePost = await File.findById(fileId);
  } catch (err) {
    return next(new HttpError("Error", 500));
  }
  console.log(filePost.file);
  res.download(filePost.file);
};