You might see that the Dropbox Community team have been busy working on some major updates to the Community itself! So, here is some info on what’s changed, what’s staying the same and what you can expect from the Dropbox Community overall.
Forum Discussion
Federico P.3
10 years agoNew member | Level 1
preview my files in iframe using http core api
Hi,
i am developing an application that let user browse his file inside my web application.
I'd like to let user preview his file inside an iframe of such webapp as such as it is done in dropbox webapp when clicking on file itself.
I have tryed using https://www.dropbox.com/developers-v1/core/docs#thumbnails and https://www.dropbox.com/developers-v1/core/docs#previews, but i see a binary object is returned in my ajax call, but i do not understand how to use such data.
Is there a "best practice" to achieve such result?
Thanks everybody
- Steve M.Dropbox Staff
A bit of extra detail:
The documentation for /thumbnails is here: https://www.dropbox.com/developers-v1/core/docs#thumbnails. The default format returned is JPEG, but you can also ask for a PNG.
The documentation for /previews is here: https://www.dropbox.com/developers-v1/core/docs#previews. That endpoint always returns HTML or PDF (depending on the type of the original file). So although the browser won't be able to display a Word doc directly, it should be able to display the preview of a Word doc, because that preview will be either HTML or PDF.
Your attempt to use a data URI will likely work if you use an img tag (not sure if an iframe will work) and actually convert the data to base64. If you can't get that working, please share your code so people can help.
- Greg-DBDropbox Staff
The thumbnails and previews endpoints return the raw data for the thumbnail or preview of the requested file, respectively. You'd need to save that data and serve it back however you want. E.g., serve it at a URL to use as the src for your iframe.
- Federico P.3New member | Level 1
Hi Gregory,
thank you for your reply. I have tryed (with thumbnail endpoint) to put raw data as src of my iframe with no luck (got an ampty iframe). I can see, in the first part of binary data, a JFIF string so i think this data is realyy a JPEG.
I wrote something like
<iframe src="data:image/*;base64,{{Raw Binary Data}}"/></iframe>
with no luck.
Also i would like to understand if binary data returned from preview endpoint would be correctly rendered inside a normal browser (i am thinking at word documents).
Thanks
- Greg-DBDropbox Staff
I don't believe iframes support data: URIs as src, so you'd have to host the data at a URL like I mentioned in my last reply.
As far as browser support for different file types are concerned, that would depend on the specific file type and browser capabilities, unrelated to Dropbox itself. For example, I don't believe most browsers can natively display word documents, and would instead offer to download the file.
About Dropbox API Support & Feedback
Find help with the Dropbox API from other developers.
5,883 PostsLatest Activity: 13 hours agoIf you need more help you can view your support options (expected response time for an email or ticket is 24 hours), or contact us on X or Facebook.
For more info on available support options for your Dropbox plan, see this article.
If you found the answer to your question in this Community thread, please 'like' the post to say thanks and to let us know it was useful!