Bubble API - Authentication
Authenticating users when using the Bubble API
This article will cover several methods to authenticate a user when trying to access a Bubble Workflow API or Bubble's Data API endpoint.
The goal of the article is to provide a clear example of the authentication methods you can use.
There are several methods to authenticate the user. The app or client context will help us decide which one to use in each case.
- Use an API Token generated in the API section in the Settings Tab:
- When you authenticate with such an API Token, the call is run in the context of an admin user of the app, who has access to all data. This method is not the best if we need to limit what the user can do or not do. At least it should be used with caution.
- Create Sign up/Login API workflows:
- This is useful for developing an alternative front-end to the Bubble app, such as a native app.
- We can sign up and log users in. This user, once the workflow is being executed, will be the 'Current user,' who you can access with actions.
- Privacy rules will apply to this user as they would if the user was logging in the Bubble app and using it in their own browser.
- The user receives a token that expires in 86400 seconds. You can login the user again to obtain a new token.
- Session cookie
- No authentication:
- In some cases, you may want to enable calls that aren't authenticated, e.g., to let a user sign up or login to the app.
- To enable this, check the box 'This workflow can be run without authentication' at the workflow level.
- When a workflow is run under such circumstances, the privacy rules that apply are the one for 'everyone.'
Create a signup workflow:
API wf info
Sign up action info
Create a login workflow:
API wf info
Login action info
API call to the sign up workflow example:
NodeJS - Axios
1
var axios = require('axios');
2
var FormData = require('form-data');
3
var data = new FormData();
4
data.append('email', 'USER_EMAIL');
5
data.append('password', 'USER_PASSWORD');
6
7
var config = {
8
method: 'post',
9
url: 'YOUR_BUBBLE_APP_URL/version-test/api/1.1/wf/signup',
10
headers: {
11
...data.getHeaders()
12
},
13
data : data
14
};
15
16
axios(config)
17
.then(function (response) {
18
console.log(JSON.stringify(response.data));
19
})
20
.catch(function (error) {
21
console.log(error);
22
});
23
cURL
1
curl --location --request POST 'YOUR_BUBBLE_APP_URL/version-test/api/1.1/wf/signup' \
2
--form 'email="USER_EMAIL"' \
3
--form 'password="USER_PASSWORD"'
Both the signup and the login workflow responses use the same schema:
1
{
2
"status": "success",
3
"response": {
4
"token": "1673441284837x593001571178241900",
5
"user_id": "1673436829567x808711980741338100",
6
"expires": 86400
7
}
8
}
Then you can have any kind of workflow. The user will be the one identified on the signup or login API call from where you got the token.
API wf info
In this example we'll return the App settings object unique id and the number of users the app has:
Worflow action
The API call. In this case we won't be passing any parameters, just the token as a Bearer token:
NodeJS - Axios
1
var axios = require('axios');
2
var FormData = require('form-data');
3
var data = new FormData();
4
5
var config = {
6
method: 'post',
7
url: 'https://YOUR_BUBBLE_APP_URL/version-test/api/1.1/wf/get_app_info',
8
headers: {
9
'Authorization': 'Bearer 1673441284837x593001571178241900',
10
...data.getHeaders()
11
},
12
data : data
13
};
14
15
axios(config)
16
.then(function (response) {
17
console.log(JSON.stringify(response.data));
18
})
19
.catch(function (error) {
20
console.log(error);
21
});
cURL
1
curl --location --request POST 'YOUR_BUBBLE_APP_URL/version-test/api/1.1/wf/get_app_info' \
2
--header 'Authorization: Bearer 1673441284837x593001571178241900'
The response from our app API:
1
{
2
"status": "success",
3
"response": {
4
"id": "1650534160106x505836262754615300",
5
"users_count": 2
6
}
7
}
Last modified 2mo ago