I have a small JavaScript code that fetch a PHP file, it returns a PDF, and I have to send that PDF in a stream to the user.

const guestForm = document.getElementById("guest-form");

guestForm.addEventListener("submit", (e) => {
  e.preventDefault();

  // Set button to loading mode
  const submitButton = document.getElementById("submit-button");
  submitButton.innerHTML = "LOADING...";
  submitButton.disabled = true;

  const firstName = document
    .getElementById("guest-form-first-name")
    .value.toUpperCase();
  const lastName = document
    .getElementById("guest-form-last-name")
    .value.toUpperCase();
  const email = document.getElementById("guest-form-email").value;

  fetch("/services/printInvitation.php", {
    method: "POST",
    headers: {
      "Content-Type": "application/json",
    },
    body: JSON.stringify({
      firstName,
      lastName,
      email,
    }),
  })
    .then((response) => response.blob())
    .then((blob) => {
      blob.type = "application/pdf";
      const file = new File([blob], "document.pdf", {
        type: "application/pdf",
      });
      const objectUrl = URL.createObjectURL(file, {
        type: "application/pdf",
      });

      submitButton.innerHTML = "ENTER";
      submitButton.disabled = false;
      window.location.href = objectUrl;
    });
});

The problem is that in Chrome based web browsers (Google Chrome, Brave Browser, Microsoft Edge, etc.), when the user tries to download the PDF file, it shows "Failed - Network error". As you can see, I already declared the MIME Type many times in the code, but stills failing.

What am I doing wrong?