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

helloworld123's avatar
helloworld123
Explorer | Level 3
3 years ago

How can I read files from Dropbox to display on my React webpage?

Hello, 

 

I was able to connect to Dropbox and make a call dropbox.files_list_folder(path="") to fetch information about files I have uploaded to my storage. 

 

However, I just can't find a way to display the image to my webpage... I tried using 'path_display' field to try to get it done but it doesn't seem like this will let me pass even when i am using a token correctly. 

 

Is this possible? I came across a post on Reddit that Dropbox doesn't support this but only allows reading info/metadata and uploading to Dropbox... 

 

Is that true? 

  • The path_display attribute returned in file metadata shows a path to the content within the user's Dropbox; it is not browser accessible URL.

     

    The Dropbox API has files/download & files/get_thumbnail_v2 calls that will enable you to retrieve binary content for use in your application - but you'll need to manage making that content accessible to the browser.  files/get_temporary_link will enable you to request a URL for reading content, but note that this link is not to be used for directly displaying content in the browser.  All of these calls require the files.content.read scope; you may prompt the user to access file content. 

     

    The recommended - and easiest - ways to embed Dropbox content on a web page so a user may preview it is with the Embedder. The component allows a user to interact with Dropbox content within an iframe on your page.

  • kylea's avatar
    kylea
    Icon for Dropbox Staff rankDropbox Staff

    The path_display attribute returned in file metadata shows a path to the content within the user's Dropbox; it is not browser accessible URL.

     

    The Dropbox API has files/download & files/get_thumbnail_v2 calls that will enable you to retrieve binary content for use in your application - but you'll need to manage making that content accessible to the browser.  files/get_temporary_link will enable you to request a URL for reading content, but note that this link is not to be used for directly displaying content in the browser.  All of these calls require the files.content.read scope; you may prompt the user to access file content. 

     

    The recommended - and easiest - ways to embed Dropbox content on a web page so a user may preview it is with the Embedder. The component allows a user to interact with Dropbox content within an iframe on your page.

About Dropbox API Support & Feedback

Node avatar for Dropbox API Support & Feedback

Find help with the Dropbox API from other developers.

5,911 PostsLatest Activity: 6 hours ago
333 Following

If 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!