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.