Need Help Linking Dropzone.js with Dropbox Upload

Hi,

I’m looking to add a functionality to my app which allows the user to login into their own Dropbox account and upload files to it via the Multi-File Uploader Bubble Plugin (powered by dropzone.js). Bubble doesn’t have any working Dropbox plugins, and the Multi-File uploader doesn’t have Dropbox as a storage option, so I’m currently clueless about what to do. Any help appreciated.

Thanks

Does Dropbox have any API? That’s most likely the solution.

yes it does, but it’s not a REST API but an RPC one. The user endpoint requires a POST request not a GET request, which is the bubble default.

Are you using the API connector plugin to construct the request?

Yes. Is there a alternative?

First, you’ll want your user to authenticate using the User Authentication:
Authentication types - Developers - Dropbox

This will return a Bearer token. Use that token in the call’s header to make the rest of the API calls for that user’s session.

You can change the call type for any call.

I haven’t implemented dropbox, but they offer a tool for you to test the call before putting it into bubble.
https://dropbox.github.io/dropbox-api-v2-explorer/

As always, it’s best to test in Postman to make sure.

Yes exactly.

I’m using the OAUTH2 User Agent Flow settings for the API connector in Bubble. See below:

It is giving me the following error upon have user sign in :

03%20AM

Is there some other way to authenticate. Seems like Dropbox isn’t a REST API(uses RPC), and hence isn’t beholden to the usual GET way to authenticate.

I went down this rabbit hole but I was looking to provide access not only to dropbox but other third-party storage. The whole token exchange added with the lack of functionality of the multi file quashed journey for me. I ended up using uploadcare service … This handles all access tokens and authentication to the various storage vendor’s plus for a fee (small in my view) you can brand these also this single or multiple file upload with additional processing. I have no affiliation to uploadcare… Just saying

Hey thanks for the reply.

Seems like the zeroqode uploadcare plugin basically allows you to upload files from different source of user’s files like DropBox etc. What I need is a way to create a new DropBox folder in the user’s account, and upload a file to it via Multi-File Uploader. Did you have a similar use case?

Here is my API connector

i think your missing shared headers for calls…give that a whirl

If you use bubble to sign users up with this method than they are precluded from any other sign up method… Just saying

This should then give you access to all the API calls for dropbox including upload to their endpoints

I’m pretty sure upload is in binary format not base64

I’ve noticed both the Dropbox plugins on Bubble use this user profile endpoint, but it belongs to Dropbox V1 API which is deprecated. Is this working for you?

1 Like

Do your calls work outside of Bubble?

yep all working …as @scottb50 suggested get it working in postman for example then port across

I have tried to set up the Dropbox API as I want my users to upload PDFs to their respective Dropbox account. This is what I’ve done:


However I keep getting an error. When I try initialise the call in the API connector, I get this error:

And when i try “log into Dropbox in developer mode”, I get this error message:

Inkederror_LI

Can someone please advise on what I can do to get this working? Perhaps someone who has a working version of the Dropbox API? @Bubbleboy I’d really appreciate your suggestions.

Hi Leon

Did you ever get past this point where it says “The given OAuth 2 access token is malformed.”
I’m at the same point and have been checking settings on both the Bubble side and the Dropbox app side but can’t help but think it’s something simple.

Any ideas?

Many thanks

1 Like