Trigger download prompt on iOS Safari for PDF File

Viewed 1263

I am trying to show the iOS users of my web app a (native) download prompt for a PDF file like this one when they click a button/link:

iOS Download prompt

Unfortunately all I tried resulted in Safari opening the file in a new or current tab. I tried using FileSaver.js like this:

saveAs("https://example.com/pdf", "filename.pdf");

I tried an a tag: (with and without target="_blank")

<a href="https://example.com/pdf">Download</a>

I tried using fetch to get the file and use FileSaver.js to save the Blob:

const res = await fetch("https://example.com/pdf", {
        mode: "cors",
        method: "GET",
        cache: "force-cache",
        headers: {
          Accept: "application/pdf",
        },
      });

const blob = await res.blob();

saveAs(blob, "filename.pdf");

I can control the server response though. These are the headers I currently set

Content-Type:  application/pdf
Content-Disposition: attachment; filename="Bauhaus%20-%2001-04-2019%2015-59.pdf"

Thanks in advance!

1 Answers

If you set the Content-Type header in the server response to application/octet-stream, Safari won't recognize the file as PDF, and therefore won't open it and offer the download prompt.

Related