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

Yaykyo's avatar
Yaykyo
New member | Level 2
6 years ago

It's possible to upload from javascript using URL instead of Blob/object?

Hello, I'm trying to upload a file to my Dropbox account through javascript.

Actually, I've been using this:

 

    var dbx = new Dropbox.Dropbox({ accessToken: ''+data.dropbox_key+'', fetch: fetch });
    dbx.filesUpload({path: ''+data.dropbox_path+'' + data.file.name, contents: file})  

 

the file blob/object was getting it from the input file

But actually I'm building another way to upload files and in this way, I don't have an input to get the file/object but the URL.

So my idea was something similar to this:

 

    var file = "https://www.imperva.com/blog/wp-content/uploads/sites/9/2018/04/B64-8.png";
var dbx = new Dropbox.Dropbox({ accessToken: ''+data.dropbox_key+'', fetch: fetch }); dbx.filesUpload({path: ''+data.dropbox_path+'' + data.file.name, contents: file})

 

But it uploads the file corrupted, so any way to upload using Javascript but using a URL as the source of the file?

Thanks!

  • The Dropbox API does have an endpoint that will save files from a URL. In the JavaScript SDK, you want the filesSaveUrl() method, which accepts two parameters: a link to the file you want to save and a path for where you want the file saved in Dropbox.

    I have some other comments regarding your code. No offense intended. My goal is to educate rather than criticize. 

    1. Compare your first use case to the second. In the first, you're uploading a file (literal bytes of data) to an endpoint. In the second, you're simply declaring a string as a variable (in this case, a URL) and passing it to the same endpoint. The endpoint doesn't behave the same because it's receiving totally different object types as a parameter. Does that make sense? 

    2. In your second code sample, you're creating a variable named `file` and setting it to a string that is a URL. However, you're trying to access that value by referencing `data.file.name`, but that object doesn't exist (at least in the code you shared). You'll need to update that section of code to pass back a correctly formatted path to the file. 

    3. As a general tip, a deep fundamental understanding the different types of objects in JavaScript can make a huge difference when interacting with public APIs. 

    Best of luck!

About Dropbox API Support & Feedback

Node avatar for Dropbox API Support & Feedback

Find help with the Dropbox API from other developers.

5,888 PostsLatest Activity: 18 hours ago
326 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!