Child Item

Displaying file from Dropbox into a WebApplication using Dropbox API

Hello,
I want to find the best way to view a file like a video or image from Dropbox into a Website using HTTP or Javascript SDK

for example I'm trying at least to download a file using the shared link and CURL
I also have a question should I use double quotes or single quotes with CURL in the Doc of the website there is a Double quotes but I saw some API calls with single quotes

Basically, It's sync a folder's files which on Dropbox to the Website.

curl -X POST https://content.dropboxapi.com/2/sharing/get_shared_link_file \

--header "Authorization: Bearer <REDACTED> " \

--header "Dropbox-API-Arg: { \"path\":\"/Hi/drop.jpg\",\"url\":\"https://www.dropbox.com/s/tmziscnuzavon9a/drop.jpg?dl=0\"}"

It prints this error: {"error_summary": "shared_link_not_found/", "error": {".tag": "shared_link_not_found"}}

Find more posts tagged with

API

Abuse

Accepted answers

Greg-DB

Unfortunately, the Dropbox Chooser does not have an option for retrieving "direct" links that do not expire, but I'll pass this along as a feature request. I can't promise if or when that might be implemented though. As a workaround, you can use "preview" links, which don't expire, and modify them for direct access as documented here.

Also, regarding the issue with the files being disabled, looking at your code, it seems the issue here is that you're setting sizeLimit: 1024, which is limiting the user to selecting only relatively small files. Please try removing that option and you should see larger files selectable.

All comments

Greg-DB

I see you're calling /2/sharing/get_shared_link_file and are supplying both the "url" parameter and "path" parameter. The particular shared link you're sending as the "url" is for a file though; in that case you should not also supply the "path" parameter. The "path" parameter is only for when you need to specify a relative path under a folder when the "url" you are supplying is for a folder, not a file. Try the call again without setting the "path" parameter.

Also, I've redacted it from your post, but for future reference, do not share your access token.

Mostafa Ezzat

Thanks for response, If I may ask about something important. I have a website that I need to make the users of Dropbox to import their videos into the application itself by clicking a button and authenticate after that and then pick the folder they want to.

So What are my options relating to Dropbox API, In other words what are the best features that I should use.
Should I use sharing link and downloading the video or even can I someway fetch all the folder files into website.

Thanks in advance.

Mostafa Ezzat

Btw, I also have Js SDK installed, I didn't make test yet but I think it would work normally. So I mean if my best options to use one of the SDK or HTTP it will be okay.

Greg-DB

While you can use either the HTTPS endpoints themselves or one of our official SDKs such as the Dropbox JavaScript SDK (or a third party library) to access the Dropbox API, we do recommend using one of the official SDKs, as they'll do much of the work for you.

In the Dropbox JavaScript SDK, the corresponding method for /2/sharing/get_shared_link_file is sharingGetSharedLinkFile.

Exactly what features you use is up to you, depending on the specifics of what your app needs exactly. I recommend reading the File Access Guide for some good reference on interacting with files in Dropbox accounts via the Dropbox API.

Also, as an alternative to the API/SDKs, for web apps that just need to allow end-users to select files from their accounts to give to the app, the Dropbox Chooser can be a good, simpler option. Check that out first to see if that works for your use case.

Mostafa Ezzat

Yes Chooser Feature this's exactly what I want, but the button it doesn't working at all can I just get a demo to implement the button in my app and able to make the user login and choose the files that he wants with providing options array to this. Thanks in advance.

Greg-DB

The Dropbox Chooser page does include a working demo under the "Demo" section. Is that "Choose from Dropbox" button not working for you? If not, what exactly does/doesn't happen? Do you get any error message?

Mostafa Ezzat

This's my code I added the js lib of Dropbox, Do I miss something else? but the button it doesn't appear
I also have only one issue can I make the direct link doesn't expire because my scenario will be the user will choose the videos or images, Then I get the direct link and that will be previewed in the application that if anybody wants to watch the video or the image but the link expires.

<html>

<head>

</head>

<body>

</video>

options = {

// Required. Called when a user selects an item in the Chooser.

success: function(files) {

alert("Here's the file link: " + files[0].link)

// Optional. Called when the user closes the dialog without selecting a file

// and does not include any parameters.

cancel: function() {

// Optional. "preview" (default) is a preview link to the document for sharing,

// "direct" is an expiring link to download the contents of the file. For more

// information about link types, see Link types below.

linkType: "direct", // or "direct"

// Optional. A value of false (default) limits selection to a single file, while

// true enables multiple file selection.

multiselect: true, // or true

// Optional. This is a list of file extensions. If specified, the user will

// only be able to select files with these extensions. You may also specify

// file types, such as "video" or "images" in the list. For more information,

// see File types below. By default, all extensions are allowed.

extensions: ['.pdf', '.doc', '.docx', '.mp4'],

// Optional. A value of false (default) limits selection to files,

// while true allows the user to select both folders and files.

// You cannot specify `linkType: "direct"` when using `folderselect: true`.

folderselect: true, // or true

// Optional. A limit on the size of each file that may be selected, in bytes.

// If specified, the user will only be able to select files with size

// less than or equal to this limit .

// For the purposes of this option, folders have size zero.

sizeLimit: 1024, // or any positive number

};

var button = Dropbox.createChooseButton(options);

document.getElementById("container").appendChild(button);

</script>

</html>

Mostafa Ezzat

Update 1: Everything is good Sir, It works and it's fine, My only problem now is link expiring because my scenario will be I get the direct links save them in the database then get these links when it requested so if the link expires will be error so how can I make the direct link doesn't expire, and Is there any comments about this scenario, Do you think I'll face any problem in it soon while implementing along with Dropbox? Thanks in advance

Update: I did implement the button and it opens but I can't select any thing the selection button not exist. So all I just need is to get a direct link that doesn't expire at all. Thanks in advance and appreciate.
I followed this link :https://dropbox.tech/developers/quickly-integrate-file-upload-in-your-web-app-using-the-chooser
Screenshot 2022-04-21 121111.png

Greg-DB

Mostafa Ezzat

Can I ask one last question, Please.
Can I add any parameters to options array here to get the directory name, the normal options response I get the name of the file, So I need also the name of the folder, sharing_get_shared_link_metadata I'm thinking of using this if it's not possible to do the previous one but it will request additional requests for sure. Thanks in advance

Greg-DB

No, the Dropbox Chooser does not offer an option for getting the name of the parent directory of the selected file. You can find all of the available options in the Chooser documentation.