Forum Documentation Showcase Pricing Learn more

Output an object in the server-side action

Hello everyone,

I want to share a workaround, which will give you the possibility to return a whole object in the server-side action.

For instance, you have a server-side action, which should return the following object:
image

Goal:
Make that object be accessible in the Bubble editor.

Step 1:

a) Add a new server-side action in the plugin editor.
b) Create a new field. On its the Editor dropdown select the App Type.
c) Create a new return value. Select a field from the previous step for the Key Type dropdown.

Step 2:

The idea is to create a template for our object.

a) Go to the API calls tab.
b) Click on the Add an API connection button in the case if you have no APIs already configured.
c) Set a test name for the API. For instance, Doughnut.
d) Click on the Add another call button. Use Server-side | Test action as a test name for the API call.
e) Here you need to use any link, which will have a JSON object in the response.
For instance,
https://jus4tests.bubbleapps.io/version-test/api/1.1/obj/Record

f) Click on the Initialize call button.

g) Click on the Show raw data element.
h) Click on the Edit raw data element.
i) Use the following JSON object:
{
“status”: “success”,
“payment_id”: “123456789”,
“amount”: {
“value”: 100,
“currency”: “USD”
},
“transactions”: [
{
“transaction_id”: “123456789”,
“status”: “success”
},
{
“transaction_id”: “234567891”,
“status”: “success”
}
]
}

j) Click on the Save button.

k) Take a look at the returned values. If all is okay, click on the Save button.

Step 3:
a) Go to the server-side action to insert the following code:
function(properties, context) {

let response = {
    _p_status: "success",
    _p_payment_id: "123456789",
    "_p_amount.value": 100,
    "_p_amount.currency": "USD",
    _p_transactions: [
        {
            _p_transaction_id: "123456789",
            _p_status: "success"
        },
        {
            _p_transaction_id: "234567891",
            _p_status: "success"
        }
    ]
};

return {
    "object": response
}

}

You can notice, that almost all fields have _ p _ (without spaces) prefix now. That it is a required step.
Also, the object amount was transformed from:

amount: {
value: 100,
currency: “USD”
}

to:
“_p_amount.value”: 100,
“_p_amount.currency”: “USD”,

It is required for all object fields.

b) Test it on your app

Result:


BTW, I’m not sure if that solution wasn’t already shared by others.
I’m sorry for the spamming, If it was.

4 Likes