Forum Academy Marketplace Showcase Pricing Features

[New Feature] Added the ability to POST to a workflow endpoint from the browser

We just added another way to trigger a workflow, through a POST request from the browser. What will be returned then is not a JSON response, but a 302 redirect to a page that you pick, and the data returned as a response (that is defined in the return data from API action) will be added to the URL as a querystring.

You can pick this option by picking 302 redirection as the response type.

This is particularly useful when you want to POST from a form in a page (usually outside of Bubble), or to handle specific APIs.

13 Likes

Great feature, thank you Emmanuel & Bubble team for allowing your users to sponsor such feature to expand bubble capability.

5 Likes

Sorry I should have added a special thank to @vascolucci for sponsoring this one that benefits to everyone!

4 Likes

Now, in English please. :wink:

1 Like

What’s an example use case for this?

2 Likes

I have a problem when I add an iframe (of my bubble site) on a no-bubble site. The problem is linked with the cookies and safari that did’t allow to load the data from my bubble database. The problem is already posted here: Lists don't work if cookies are disabled / page embeded inside iframe

This new feature can help me to resolve this issue?
Thanks a lot

I am also interested im some use cases for this.

1 Like

@AliFarahat @gaurav @gnelson This is useful when integrating with external forms that use the POST method for redirecting a user after form submission.

Since you can’t just POST directly to any regular page in your app, you need to provide a url that can receive the POST data and return a response - ie, an API endpoint. The problem is that if this is happening as a result of a form submission, and the form redirects the user to the API response, the user will just see the JSON response on a blank page.

Not useful. So, the update gives us the option to change the response from JSON to a page redirect.

For example, when a Typeform or Google Form response is submitted… you usually have the option to redirect them to a web page like a Thank You or Confirmation… Those services make things easy and built in so that you can provide a regular web page url and you’re done.

However, there are other services where integration is a bit more manual and redirection happens via a POST call, especially when sending of data is necessary (validation, security, etc). So you need to redirect to an endpoint that can receive the data.

I’ve already seen two real Bubble world examples. The first was just an external form that needed somewhere to redirect users and it would only do it through a POST method.

The second was for a payment gateway integration. The payment form is hosted by the PCI compliant gateway, users fill out the form with their sensitive info, and when they click submit, the gateway POSTs to Bubble endpoint with whatever transaction data, and the user is taken to the redirected page for confirmation of form submission.

What’s cool is that Bubble lets you define two different pages based on a success or error response. Eg if the POST data didn’t contain a valid parameter to pass some kind of verification

Hope I didn’t botch the explanation and hopefully this makes sense!

And for those really interested, pretty sure what’s happening is this:

350px-PostRedirectGet_DoubleSubmitSolution

Source: https://en.m.wikipedia.org/wiki/Post/Redirect/Get


Gaby | Coaching Bubble
Private coaching, courses, and tons of free resources

14 Likes

Thanks Gaby for going to all this trouble to explain this. Now I understand…I think. :slight_smile:

It is not clear, if you one can use this feature to submit data on a bubble form to third part/external server and display a success/error page based on response from that server, is it?

Just came across this feature, was very helpful.

The use case was the same as one that Gaby described above (2+ years ago): a PCI compliant gateway.

The gateway is displayed in an iFrame on the page, so the credit/debit card data doesn’t pass through the Bubble servers.

When users complete their payment, the response is an HTTP POST call that is directed to an API workflow endpoint.

That API Workflow endpoint t^\d+hen redirects to a Bubble page and can send along data to that page as well.


Screenshot from 2020-07-14 08-22-57

After a user submits the form, these API workflows redirect the iFrame on the page to the fpms-result Bubble page to display a success/failure message.

Thanks as always, Bubble team and Bubble community for the feature and for the helpful discussion.

1 Like