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

Yaykyo

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!

TaylorKrusen

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!