Forum Documentation Showcase Pricing Learn more

BOX Plugin Instructions

Firstly, a note about box. If you have an individual account you will follow the same steps as an enterprise account. An Enterprise ID is something you can get as a free individual or a major account holder! The fact that you can sign up and purchase an enterprise account is not what gives you an enterprise ID. Business accounts have an enterprise ID but if you’re a free account holder by logging in as a developer seen in step 1 you will also get an enterprise ID.

  1. Go to developer.box.com and login with your box account to enable yourself as a developer.

  2. Once in your developers console click “create new app”.

  3. Now choose Enterprise Integration.

  4. Choose 0Auth 2.0 with JWT (Server Authentication).

  5. Give your app a name, click create then click “view your app”.

  6. Scroll down to add public key. At this point you will be asked to setup 2 step authentication so if you have not already done so proceed with that now.

  7. Open you bubble editor settings and navigate to the API tab, click download public JSON web key.

  8. Copy the entire contents of the text file into the public key field in the box console.

  9. You will now see a short public key id – copy and paste that into public key id in the box

  1. Make your “application scopes” & “advanced features” (if you change any of these settings at a later date you must follow step 16 except choosing to reauthorize the app to makes the changes take effect).

  1. Now scroll up and copy the Client ID – Paste it into BOTH Client ID & API KEY sections of the box plugin.

  2. Copy the client secret – paste it into the client secret section of the box plugin.

  3. Now click “general” tab on the left hand side of the box window, find the User ID & Enterprise ID – copy them into the User ID & Enterprise ID sections of the box plugin.

  4. Now on the top right of your browser click the account dropdown (seen as a head icon), select “admin console”.

  5. Now on the top right of your browser click the gear icon, Select business settings.

  6. Click the tab “apps” – Scroll down to custom applications and click authorize new app.

  7. Enter the Client ID – the same as the API key you put in the box plugin. Then click next to Authorize.

  8. That’s it, you can now add upload elements in the editor and set the storage to box!

Good to know:

  • Uploads will go to your main accounts content – inside a folder that you set for the upload element.
  • Deleting a thing will remove it from bubble as a data record so it is gone as far as the app is concerned, but the file will remain in your Box account.
  • Don’t forget you can set the privacy setting in data, then privacy in the editor.
  • When you drop a file into an element it is uploading to box already.
  • You should treat the upload as if it’s uploading to bubble and still create a thing so you can reference the data.
  • Yes this method will still limit you to 50mb uploads, keep an eye out for a plugin I am developing to supercharge your Box integration soon!

Let me know if this helped you out, if your still stuck let me know and i will see what i can do to help :slight_smile:

  • Yes
  • No

0 voters

11 Likes

Hey Jarrad,
Excellent tutorial, thanks!
Any update on the box plugin that wouldn’t have the 50 MB limit?

Thanks,
Levon.

Founder at Bubblewits - Bubble Certified Partner


http://bubblestore.io – a place to buy Bubble templates for landing pages, e-commerce, workflows, APIs etc.
http://iambubble.com - one page Bubble demo
http://builtwithoutcode.com/ - Collection of apps built on Bubble

1 Like

Hi mate,
I’m still plugging away at it. there are a few things I really want to include but I’m waiting for the bubble team to finish a few things so I can do it without a horrible hacky way around. the good news is I am not too far off finishing a plugin that will help you out with the 50mb issue anyway. I will keep you posted. cheers

2 Likes

Hi Jarrad,
This was very helpful. Thanks. I am looking at box plugin as well and wondering if you have made any progress?

Hello @jarrad any update?

ive followed Jarrad’s instructions fastidiously (i’m doing something wrong…im getting a token error) does anyone know in the bubble upload element when i select Box do i need to specify a folder/path or is leaving this black acceptable?

Hi @jarrad,

Any progress on the Box plugin update?

We’re trying to implement some of Box’s other API calls using the Bubble API Connector, but we’re hitting some roadblocks with the authentication procedures.

Thanks

Fellow Bubble Boxers, I’ve just received a great bit of advice from Bubble support concerning privacy. My files were uploading to Box from my app and the link was created and stored, but I couldn’t view any of the files using the Bubble generated link - I got a permission denied message.

If you want to make your uploads available for viewing from within your app, you need to set the Data > Privacy settings, as @jarrad mentioned.

Since anyone logged into my app should be able to see these files, I just made the condition “When Current User is logged in” for any Data types that used a file uploader, and checked the box for attached files. I set the same condition for “Box File”, though there were no checkboxes to check.

This totally solved my problem, and I can now view the files from within my app. Thanks to @neerja for the support!

2 Likes

i follow the above step. i get error

Error connecting to Box: 400 Bad Request

what can i do? or i must enterprise account?

thanks

Hi Jarrad,

Any update on this plugin?

Thanks,
George

whether this plugin is still working? I’ve tried and followed that step, but it does not work for me. whether this should use a box business account or a personal account can also be used? someone can help me to get the answer?

I use this plugin and originally struggled to get this to work but when i followed the instructions provided by Jarrad it worked perfectly and continues to work. it should be noted this is a Bubble plugin…Jarrad kindly provided the instructions to the community. I would suggest raising any questions on the plugin with team bubble

Oke, it’s work. thanks

I screenshotted as I went along, as it is a little complex with the multiple codes.

box1

box7box9box8box12
box13box145box19box18box20box21box22
box26
box30

2 Likes

I follow all info and step and i have an Enterprise account, but i get:
“Error connecting to Box: 400 Bad Request {“error”:“invalid_grant”,“error_description”:“Signature verification error. The public key identified by “kid” must correspond to the private key used for signing.”}”

Thanks

Is there a guide to how to use the box plugin in Bubble? I was able to get the api to work and save files to box, but how do I attach them to a thing then view or modify them?

2 Likes

Hey @tim1

the documentation is here
http://docs.zeroqode.com/plugins/box-app-storage

and these are the 2 plugins that we have


HI Levon, with this zeroqode plugin can I upload multiple files at once? (and if so, can they exceed the 50mb limit altogther?)

Hi Jeff, yes, that should be possible