API Workflow Trigger Event On Front End

Hi… I have a pretty simple API workflow, in which I send data (from my external back end) into bubble…

I want to take this data that is received from the incoming API request to bubble, and trigger things on the front end… For example, I want to take this data from the inbound API to bubble, and then “display” the data on the front end…

Notes: I do NOT want to use bubble back end. I see some methods saying that I should use the API connector (I already have 100 + connections so Im familiar), but I cannot seem to trigger an event… So for example, i am happy to have a “do when condition is true” or something but I cannot seem to get bubbles backend and front end to communicate in any way…

I also dont want to run events based upon the “do every 5 minutes” or something, as that would create an insane amount of requests to my 3rd party backend and its useless when I should be able to trigger an event to happen on bubble front end, based upon an inbound API request…

Please advise… thanks!

jon

1 Like

anyone???

Not enough detail/obtuse original post. Many of the things you say are contradictory. What. Are. You. Trying. To. Do.? Eh?

But also, in case you misunderstand some of this: List Shifter: Reverse, Rotate, Swap and ITERATE (Loop) Over Bubble Lists | Now at v1.4: Adds Numeric Option, GET INDEX Action - #590 by keith

yeah Keith its pretty simple and no what I am saying is not contradictory… Let me rephrase:

My goal: Run a backend workflow in bubble triggered by an inbound API call (already figured this out) to then (somehow) trigger a front end workflow…

Pretty simple…EH?

Where i have gotten to thusfar:

  1. I have a back end workflow… The trigger is an API inbound webhook… all good here
  2. I have found that the only way to pass the information that works for me, is to create a record in a database in bubble that I only use to pas information back and forth between front and back end (I DO NOT USE BUBBLES DB’s OTHERWISE)
  3. It seems that a “do when condition is true” is the best method to somehow “get the newly created record” from the DB to then trigger a workflow for the front end, I just cannot figure out how to do so…
  4. **Note: I do see some forum posts saying in the “only when”, spot to do a “search for” and I have tried that to no avail… I think I am 'searching" incorrectly as it seems to not be working at this debug point… What could I put in the “search for” part that would work?

Hopefully this is easier to understand…
Jon

I think the problem here is

How is Bubble going to know which client to send this to? If you wanted everyone to see this change, then this is what Bubble’s always-refreshing database is meant for. A central place for all the clients to grab always live data. Then the client just has something always looking in the database and displaying it.

Would you want your webhook to create a new database item, all the clients see that and react, or just one database item and your webhook keeps taking that one and modifying it a lot? Then your clients react to the change?

If you want minimal database usage maybe the latter…

thanks for the detailed response!

Yes I want the webhook to create a database item. The database is the only way I know of that will influence “displaying data” etc. on the front end portion of the app.

To put it simply, If I could influence bubble to trigger something (using my 3rd party back end which i use for my main back end its called Xano) without the DB, that would be ideal. But as far as I have seen, I cannot influence anything on the front end without using the Bubble database as a conduit.

So, to answer where you say - “Would you want your webhook to create a new database item, all the clients see that and react, or just one database item and your webhook keeps taking that one and modifying it a lot? Then your clients react to the change?” — My response is, the database item doesnt matter at all in any way, its only used to trigger something in bubble. The actual data can be completely blank.

So, where I am at and what I think id like to figure out from here, is a way to do the following:

  • Do when a condition is true
  • “search” for any item at all added to the database based upon something like “first-item created date changed” (really this can be anything that finds the new record
  • Then run the API connector functions that I want to on the front end
    *the last step would be deleting the database entirely

Ive tried for a few hours last night to no avail… How would i set that up?

So for example, why is this not searching the database called “refresh conversations” every 5 seconds, checking to see if there is a record and then “making a change” based upon this record?

The change to be made (that is not visible) is to change 1 field from a “no” to a “yes” which it does not do, hence, the do when and search part (as i assume it to be) isn’t searching correctly?

So set up a datatype, in my case it’s called Thing with a field Updated date (date).
Manually create one in your database.
Your webhook does this:


So it sets the date field to current date.

On the client side, make a custom state on the page, in my case it’s on the page index, called Update date (date).

Then you do

So when the first item in your database (the only item)'s date is greater than the page’s states date, then the first action sets that state to the Current date/time, then you can trigger whatever API call you want after.

I didn’t want to do any creating/deleting since one client could delete something before another gets triggered (not sure if that’s possible but who knows) Plus all the clients at once would be trying to delete one thing.

There is an option when setting up the API to run the API directly from the browser, so your clients could directly retrieve from your external database. VS now it will make the call through your server, then server sends to client. But it requires no headers and no authentication so not sure if that’s applicable here.

@tylerboodman Ok, so i tried what you have said. Didnt work. BUT, i am troubleshooting.

So, the backend part is relatively straightforward and it updates that field. I have confirmed this. However, I do have to “refresh” the data at the bottom to “see” the change…is this normal?
Screen Shot 2023-01-13 at 2.34.48 PM

It seems that the “do when” is not working… I am not sure why… Why would I want to set the “date” for the state of the page within the workflow? cant I just leave it as a static date in the Past?

Anyways, for some reason the “do when” is not triggering… Any ideas? Heres the whole function (without the set state of element, as I have made it static date)

Yes sometimes the app data view doesn’t auto update. (your database is still auto-updating it’s just that view isn’t)

The “Do when” workflow seems to only keep triggering when it’s true, then false, then the next true triggers it again. So if it’s always in the past it will never re-trigger because it just stayed true the whole time. My idea was set the state to the current date, making it newer than the webhook’s date (even just by a millisecond is all you need)

So add a “Set state of an element” action and set a custom state on the page (type Date)

I want to summon Keith to possibly steer this in a better direction but I’m scared he’s gonna roast me/my idea

@tylerboodman Got it… So you are saying this:

  1. Webhook triggers
  2. Updates Field
  3. This would then make the updated date field in the DB to greater than the “state” date
  4. This would then trigger the “do when”
  5. The first step in the workflow is to then update the “states” date so that it comes after the updated date, hence, not continually running as you mentioned

Sounds great! its jsut not working lol… I have added another field to update in that first item in the DB as well, (its a dummy field to debug whether or not the “do when” is firing)… The “do when” is not firing based upon this… Again, any ideas?

Change the Run this to Everytime, is there any Privacy rules preventing the search from finding that one database item?

yeah sorry I have changed to “everytime” i was just troubleshooting…didnt work with either

Where can i see the privacy rules?

Oh I see… no privacy rules its set to public

OK so I tried in debug mode and it worked but its not working (not in debug mode)… Any thoughts? does it have to do with the database being in "live"mode or something?

I bet he will :rofl:

Guys… I use it A LOT in my apps and what I do is almost identical of what @tylerboodman is suggesting (update database + Only When workflow in frontend).

What I think is that you have some issue with these dates :point_down:

image

Did you check your database in order to see if your action, in frontend, should have been triggered? I mean, the condition is true?

1 Like

@rpetribu @tylerboodman

I was thinking the same thing with the dates… Is it possible that the date format is not “small” enough (eg. timestamped to the millisecond)? I was thinking that if it sees 12:34PM in both the state and “updated field” for example, it might not be triggering because we will have the = times in both and we are using >.

I was able to get it to function properly however in debug mode, but I am trying to figure out why it will not perform as intended in “normal” mode…lol

Thoughts?

Make it a number field instead and just have your webhook workflow set it to itself + 1. Then make your state a number and compare those. Still keeping the Thing’s number > State’s number

EDIT: idk anymore let @rpetribu answer :laughing: