We are aware of the issue with the badge emails resending to everyone, we apologise for the inconvenience - learn more here.

Forum Discussion

haso94's avatar
haso94
Explorer | Level 3
4 years ago

How to download file from dropbox with Vue/Javascript

Hi,

 

I have a vue application where I want to download files in a specific folder. But when I call the method to do it I am getting the following error:

TypeError: Dropbox.Dropbox is not a constructor

 

I am using the latest version of the following package: 

"dropbox": "^10.10.0",

 

Can someone help me please?

This is my code hope someone can help me Identify the mistake:

getImages() {
require("isomorphic-fetch");
const Dropbox = require("dropbox").Dropbox;
const dbx = new Dropbox.Dropbox({
accessToken: '<REDACTED>', fetch
});
dbx.filesDownload({
path: "/test"
}).then(function(response){
console.log(response)
})
}

Update:

 

If I change the version to 4.0.30 and use new Dropbox instead of Dropbox.Dropbox I am getting the following error:

 

"missing_scope", required_scope: "files.content.read"} But I have given this permission in my app. If I use the Dropbox.Dropbox in this version I am still getting the is not a constructor error even though it states that it works in another post here.

  • The filesDownload method downloads a single file. If you want to download multiple files, such as all of the files in a folder, you can iterate through them and call it for each one.

     

    If you want to download an entire folder at once, you can use filesDownloadZip instead. Note that this will give you a zip of the folder which you will need to unzip locally.

  • Greg-DB's avatar
    Greg-DB
    Icon for Dropbox Staff rankDropbox Staff

    To use the 'Dropbox' constructor, that should be 'new Dropbox' instead of 'new Dropbox.Dropbox'.

     

    By the way, I redacted it from your post, but note that access tokens enable access to Dropbox accounts, so for the sake of security, you should never share access tokens like this. Since this access token has been shared here, you should disable this access token. You can do so by revoking access to the app entirely, if the access token is for your account, here:


    https://www.dropbox.com/account/connected_apps


    Or, you can disable just this access token using the API:


    https://www.dropbox.com/developers/documentation/http/documentation#auth-token-revoke

     

    That's authTokenRevoke in the JavaScript SDK:

     

    https://dropbox.github.io/dropbox-sdk-js/Dropbox.html#authTokenRevoke__anchor


    Note that doing so will cause any further API calls made using this access token to fail. This cannot be undone, and you would need to get a new access token to replace this one.

  • Greg-DB's avatar
    Greg-DB
    Icon for Dropbox Staff rankDropbox Staff

    A 'missing_scope' error indicates that while the app is permitted to use that scope, the particular access token you're using to make the API call does not have that scope granted. Also, be aware that just adding a scope to your app via the App Console does not retroactively grant that scope to existing access tokens. That being the case, to make any API calls that require that scope, you'll need to get a new access token with that scope.

    • haso94's avatar
      haso94
      Explorer | Level 3

      Thanks for the answer for both questions. And thanks for changing my auth key. Now I am getting a 409 error. It says my path is malformed. What I want to do is to download all images inside the following path:

      path: "/test/"

      test is a folder inside my dropbox I want to download all images inside it. The code is the same like in the original post with the exception of the path.

      • Greg-DB's avatar
        Greg-DB
        Icon for Dropbox Staff rankDropbox Staff

        The path value should not end with a "/". For example, if the file is named "test" and is in the root, the path should be "/test". Or as another example, if the name of the file is "test.jpg" and it is inside a folder named "folder", then the path would be "/folder/test.jpg".

         

        I recommend reading the File Access Guide for more information.

About Dropbox API Support & Feedback

Node avatar for Dropbox API Support & Feedback

Find help with the Dropbox API from other developers.

5,877 PostsLatest Activity: 12 months 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!