I have a NextJS 14 App hosted on AWS Amplify. Everything appears to work correctly except …

I have a download button that makes a FETCH (POST) request to an API endpoint. The API endpoint takes the data in the POST request and generates a PDF file. The API then returns the PDF to the frontend and the download is triggered.

• The implementation below works on localhost
• The implementation below works on Vercel
• The implementation below does not work on AWS Amplify. The PDF downloads and has the correct number of pages, but all pages are blank

const handleOnClick = async () => {
  const response = await fetch(`/api/report/download`, {
    method: "POST",
    cache: "no-store",
    body: data,
    headers: {
      "Content-Type": "application/json",
    },
  });

  if (!response.ok) {
    // ...
  }

  await response.blob().then((blob) => {
    const newBlob = new Blob([blob], { type: "application/pdf" });
    const url = window.URL.createObjectURL(newBlob);
    const a = document.createElement("a");
    a.style.display = "none";
    a.href = url;
    a.download = `my-file.pdf`;
    document.body.appendChild(a);
    a.click();
    document.body.removeChild(a);
    window.URL.revokeObjectURL(url);
  });
};

The API response when console.logged out:

ReadableStream { locked: false, state: 'readable', supportsBYOB: false }

I have read old posts on StackOverflow relating to setting “Rewrite and Redirect” rules but don’t think they relate.

Downloading a PDF file in ReactJS works locally but doesn’t work on Amazon Amplify AWS

Any help would be greatly appreciated.