Also available in :
Did you knew that the âAssign a Temporary Passwordâ can represent a huge security vulnerability on your Bubble app?
Iâll tell you about the day I got access to an admin dashboard without being authorized to.
â
â ď¸ This post is not made to teach you how to hack Bubble apps. Quite the opposite, itâs here so that everyone knows about it and avoid doing the same mistake on their apps.
â
One day, I visited a website of a company that was selling Bubble.io courses (quite ironic).
The problem was on their âreset_pwâ page.
If you wanted to reset your password, they would ask for your email and then, use the âAssign a temporary passwordâ action and send the generated random password via email.
Exactly like this:
But this company has done a big mistake configuring it like that. đ¨
â
Why? Because everything is happening in the front-end.
And everything happening in the front-end is visible to any user.
â
đ¤ But I donât know what you mean Wes. How could you log into the admins accounts?
â
Here it is.
When looking at the Network Tab in your Chrome DevTools, you can see that every action triggered by this workflow results in an API Call to Bubbleâs servers.
Here I have 2 steps in my workflow:
Result of both steps are returned by Bubble in the result of the âstartâ request, which starts the chain of actions.
â
And if we look at the result of step n°1 (which is the âAssign a temporary passwordâ one), we can see here, in plain-text, the new assigned password.
â
Which means⌠and I know you see it comingâŚ
đĄ What if I fill the email of an admin user when I want to reset the password, instead of putting my own email?!
If in the âWhatâs your email?â input I type âadmin@company.comâ, it WILL reset its password⌠and Iâll be able to see it in plain-text in the Network Tab of my Chrome DevTools.
Now, I just need to go to the login page and fill the following credentials to be logged in as an admin:
â
I couldnât just come up with a security issue without also coming with the associated fix. So there you go â
Itâs actually quite easy (thanks Bubble).
If you know that everything happening in the front-end can be seen by anyoneâŚ
Just perform this action in the back-end side of your app.
Letâs go step-by-step through this.
â
Weâll go to the back-end section of the app, and create a new API Workflow that we will call âassign-temporary-passwordâ.
It will take a parameter:
user-email
of type âtextâThen, weâll simply reproduce the exact same behavior than what our initial workflow was doing.
Hereâs a screenshot:
â
Now, letâs go back to our previous workflow - the one on the âreset_pwâ page.
Letâs delete all the actions inside of it, and make it just trigger our freshly created API workflow and fill in the associated parameter.
â
And⌠there we go! â
The security issue is now fixed and weâre all set đ
đ Here is the link to the demo app if youâd like to know how to implement it.
â
As mentioned in Bubbleâs official documentation, the most secure way to work with passwords is to use the âReset Passwordâ action.
Important: This workflow action is meant to be used in a situation where an admin is resetting the password for a user - the admin can see the new password. We do not recommend building this into an end-user-facing flow on a page because it is not a secure way to work with passwords.
â
If you can implement this logic, thatâs the best you can do.
But if you need to use the âAssign a temporary passwordâ in your flow for your specific use-case, you know how to do it in a secure way.
â
PS: if youâve got any question or if thereâs anything you donât understand, feel free to reply to this thread. Iâm always happy to help âď¸
(PS2: please do remember that the website I found this issue on⌠was selling Bubble.io courses đ)
Subscribe to Our Newsletter
In-depth Bubble tips
Best tools for Bubble
Plugin updates
Reports and updates