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.
Go to developer.box.com and login with your box account to enable yourself as a developer.
Once in your developers console click “create new app”.
Now choose Enterprise Integration.
Choose 0Auth 2.0 with JWT (Server Authentication).
Give your app a name, click create then click “view your app”.
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.
Open you bubble editor settings and navigate to the API tab, click download public JSON web key.
Copy the entire contents of the text file into the public key field in the box console.
You will now see a short public key id – copy and paste that into public key id in the box
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).
Now scroll up and copy the Client ID – Paste it into BOTH Client ID & API KEY sections of the box plugin.
Copy the client secret – paste it into the client secret section of the box plugin.
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.
Now on the top right of your browser click the account dropdown (seen as a head icon), select “admin console”.
Now on the top right of your browser click the gear icon, Select business settings.
Click the tab “apps” – Scroll down to custom applications and click authorize new app.
Enter the Client ID – the same as the API key you put in the box plugin. Then click next to Authorize.
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
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
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?
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.
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!
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
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.”}”
Bubble recently increased the max file size upload limit to 5 gb, but the Bubble Box integration returns an error for files over 50mb. Can this be fixed?
Can yall please indicate that the public key pair will have to be removed from the Box application in the Dev Console if they decided to delete the Box Custom app? if not, they will be unable to continue to use the bubble integration with Box.
Really great walkthrough of the plugin @jarrad, thanks a lot!
A question; is it possible to delete files uploaded to Box using a workflow action?
I tried using the “delete uploaded file”, but nothing happened in Box and the file in question was still there.
Upload with image uploader works perfectly, but it would be great if they could be deleted as well.
@NigelG, thanks for the information. It helped a lot. Now, I only have 1 question:
Using the plugin we can upload files easily, but, how can we delete files that we had uploaded before? I just can’t do this only using the plugin. Is there a alternative solution for this? It would be perfect!
