Fetch blob in backend and send to front end

Question

I am trying to fetch a blob in the form of a media/gif and then immediately send it to my front-end. I need to first fetch it in my back-end (serverless function in Vercel) for security and caching purposes. When fetching the blob/image directly from the source URL in Postman and in my front-end everything works, but when first fetching it in my backend and then passing it to Postman and my front-end it does not work.

The code for my back-end:

export default async (_: NowRequest, response: NowResponse) => {
  const res = await Axios.get(
    "{BLOB_URL}"
  );
  response.setHeader("Content-Type", "media/gif");

  return response.status(200).send(res.data);
};

What am I missing?

Answer 1

Solved it by adding the following:

export default async (_: NowRequest, response: NowResponse) => {

  const res = await Axios.get(
    "{BLOB_URL}",
     { responseType: "arraybuffer" } <--- ADDED THIS
  );

  response.setHeader("Content-Type", "media/gif");

  return response.status(200).send(res.data);
};