I'm requesting an API to get an URL to a PDF document. I want it to be displayed in the browser to users, using <object type="application/pdf" data="url-to-pdf"></object>
.
So, when I create a link with <a href="">
to the URL the API gave me, a new tab is open in the browser with the PDF, everything works fine. I can even add the download
attribute to the <a>
and the PDF is downloaded automatically. However, when I put it in an <object>
, instead of being displayed at it is the case usually, the PDF is open in a new tab and the <object>
element is empty in the screen.
The headers of the response from the API are:
And the response itself is binary (which is expected, the file is a PDF).
Does anybody understand why it's not working for this URL specifically? The differences I see in the headers response, compare to a normal PDF that works, is the Content-Disposition
attribute, the X-Content-Type-Options: nosniff
, the cache-control being private... Can any of this has an effect? I assume it's the Content-Disposition: attachment
which is resulting on the file being open in a tab instead of inside the <object>
. Is there any way to force this header to be ignored? Can we maybe imagine a hack where we first fetch it in JS and then put the answer back in <object>
with data:
?
Thanks for your help.