cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 
Announcements
Tell us what you want to see on the Community here!
Close

Dropbox API Support & Feedback

Find help with the Dropbox API from other developers.

cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 

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

Highlighted

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

New member | Level 2

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!

1 Reply 1
Highlighted

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

Dropboxer

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!

Work Smarter with Dropbox

The way we work is changing. Share and discover new ways to work smarter with Dropbox in our community.

Sound good? Let's get started.
Who's talking

Top contributors to this post

What do Dropbox user levels mean?
Need more support?