I'm trying to create a page that could show all pictures in a dropbox folder through the Javascript API.
I was able to set up my dropbox app properly, and I am able to get a list of files.
I'm stuck at the part to get a URL I could actually use to show the picture in HTML. I tried the following code, to try and get the URL for 1 image for the time being:
dbx.filesListFolder({path: ""})
.then(function(response) {
console.log(response);
// ↑ this works!
dbx.filesGetThumbnail({path: response.entries[0].path_display, format: "jpeg", size: "w64h64"})
.then(function(result) {
window.data = result;
console.log(result);
})
// closures and rest of code...
Inspecting the window.data
or the console.log(result)
, I cannot seem to find any URL I could use in my HTML.
Any pointers to head me in the right direction? I'm still new to the Dropbox Javascript API.
Kudos to Greg
The filesGetThumbnail method doesn't itself return a URL for the thumbnail data. It returns the raw thumbnail data directly. If you want a URL to display locally in the browser, you may want to something like this:
dbx.filesGetThumbnail({"path": "/test.jpg"})
.then(function(response) {
var img = document.createElement('img');
img.src=window.URL.createObjectURL(response.fileBlob);
document.body.appendChild(img);
})
.catch(function(error) {
console.log("got error:");
console.log(error);
});
BTW, you can find all of the API v2 JavaScript SDK methods documented here.