The Retool PDF component is very limited and really reinvents the wheel as most (all ?) browsers have pdf viewers already. The component does not allow to zoom in/out, print or access a basic authenticated url. All are supported natively by Chrome, Edge, Firefox, Safari,...
I have had no luck using the object or embed tag in the HTML, iFrame or custom component (with PDF.js) to invoke the built-in viewer though.
Has someone figured out how to display e.g. https://www.africau.edu/images/default/sample.pdf natively i.e. using the browser capability ?
If that works, then our use case should work too i.e. https links to pdfs protected by Basic Auth (which caches the header/cookie in the browser) + it unlocks all PDF component limitations.
One thing you might try is using a 3rd part API like Adobe's PDF Embed to display your PDFs in Retool. I've attached an example app of what that might look like, could that work? pdf-embed-rotate.json (21.4 KB)
@Kabirdas Couldn't make your app work for me. I set up the API on Adobe website, added retool-edge.com as allowed domain, pasted the API key in textInput2, but the component always returns This application domain (https://retool-edge.com) is not authorized to use the provided PDF Embed API Client ID.
It still requires a lot of boilerplate vs. just passing the pdf to the browser to handle natively.
Why going through a component ? Which btw I feel would not work if browser must prompt for Basic Authentication.
I don't know the full limitations of using a browser's built-in PDF viewer. I think the browser's Content Security Policy is part of it (you can read more about that as it relates to PDFs in this post). There have been a number of requests to improve the PDF viewer though and I'll try and pass features along here if and when they're included.
Unfortunately, for now, viewing the PDF in a separate window or using a 3rd party API (which is indeed a lot of boilerplate) might be the best way to go.
The app should work on Cloud with retool-edge.com as the allowed domain as long as you've added the Adobe Embed API:
The app wasn't set to reload the custom component automatically when entering the API key, I edit the post so the attached json does so. That may have been the issue but if not I can take a closer look with you if you'd like!
)