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

[emmanuel]

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.

[vascolucci]

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

[emmanuel]

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

[gnelson]

Now, in English please.

[gaurav]

What’s an example use case for this?

[aledepi]

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

[AliFarahat]

I am also interested im some use cases for this.

[romanmg]

@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:

Source: Post/Redirect/Get - Wikipedia

---

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

[gnelson]

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

[vikas1]

@emmanuel

r to hand

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?

[andersan]

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.

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.

[sebastian]

Hi, I need helps.
I try to add payU payment to my website. When I create Order PayU return data with status 302. How to use Workflow endpoint use 302 redirect

Notice from PayU page:
The HTTP status code of the response is 302 and Location header is set to redirectUri , which - depending on the software used - may sometimes trigger an automatic redirect as well as receiving responses in HTML format.

https://developers.payu.com/en/restapi.html#creating_new_order_api

Thanks for help!

[avolaunch]

Hi Gaby

I am looking to do exactly what you’ve mentioned there, especially “redirection happens via a POST call, especially when sending of data is necessary (validation, security, etc)”.

So with the API doc snippet below and the example they’ve given, I went with the API Connector to do a POST call…

However, my API response comes back with all the HTML (the content of which is all correct), but I need to actually go to that redirect URL, and not just return the HTML. From what I understand, I need to make the POST call but then also go to that URL as well.

Would the feature discussed in this forum be the right application as it seems this feature redirects back to Bubble rather than away?

Many thanks

[anon26152888]

How do I set this up?

[hi113]

Hey! I just came across this…

How do I go about redirecting to an external URL that I receive as the API response (instead of redirecting to an internal page).

[jacob.b.singer]

+1 I have the same need - is this possible @emmanuel or maybe @nick.carroll ? If not, is there a technical reason why?