Saving data from json Whatsapp Webhooks into Bubble's database

[pachocastillosr]

Hi,

This thread follows this one: Verifying the Endpoint for WhatsApp Webhooks - #5 by pachocastillosr. Thanks for your contribution @NigelG

The final objective of this group of threads is to configure Whatsapp Webhooks and save the content of a Whatsapp message into our Bubble database.

Now, in the past thread we saw that it was not possible to auto detect the parameters of this requests. However, we managed to verify the endpoint by defining manually the query parameters that Meta required for the verification.

The challenge now is to find a way to bring into our Bubble database the data contained in the json objects received in a real message Webhook, like this one:

Docs: Webhooks - WhatsApp Business Platform - Documentation - Meta for Developers

Remember we can’t use Bubble’s auto detect feature (if you don’t know why, please refer to the previous thread).

Any ideas?

[NigelG]

Use Postman to force it to auto-detect the structure.

Although that is a bit tricky it seems as it wants to send it all as {body}

[pachocastillosr]

Forcing auto detect through postman worked! Thanks a lot

[NigelG]

Hi @pachocastillosr

Assuming you did the same as I did, and copy the Meta JSON body to Postman and send that as a POST …

Did you get the Meta “test” button to work at all? It triggers the endpoint but doesn’t appear to be the same data being sent. I can’t parse any of the fields. However these do parse via Postman

UPDATE

So what I had to do was fork the Meta Postman collection for WhatsApp and use that to initialise the endpoint. The structure is very different to what Meta says they are sending (coders eh).

Very very annoying that Bubble won’t show you what is received on an endpoint in the log, so you just have to guess.

[pachocastillosr]

Hey @NigelG , glad to hear that you got it working as well.

Here is what I do to see what is received on an endpoint:

First, activate this

Then save the request data raw body

Now I am facing the challenge of downloading the content of media messages (like voice notes, images, etc). I’m totally stuck, I would appreciate it if you could take a look Download binary media files from Meta API

Thanks!

[jnornella]

Hi guys !
I’m sorry, i’m a little bit lost with this . How can I force to auto-detect the parameters on postman?
After you realize the workflow with GET, what should I do ? Create another workflow with POST to detect the data? Can you show me your config. with screenshots?

[NigelG]

No, just update the same workflow to do the POST.

Meta doesn’t care it is changed.

[NigelG]

@NigelG

Did you get the Meta “test” button to work at all?

For posterity …

This button does NOTHING. It does not send any message at all (but the others do).

To test WhatsApp messages you need to set up a test business number, subscribe to messages, and then reply to the test messages from your own number.

[ivan.vazquez]

Hi everyone, @pachocastillosr I still can’t get the data from Whatsapp Did you finally got it? Help us please cc. @NigelG

[omarhendy]

thanks for the useful information guys. I have managed to setup the endpoint in bubble and setup postman and I tested sending messages from postman and it works. Now I don’t know how to get the parameters from the whatsapp webhook endpoint using postman. any help regarding how to get the parameters using postman will be much appreciated.

[omarhendy]

I managed to make it work!

in postman just make the endpoint initialize again from the same workflow.
make a new post request with the body being the body of “view message” found in the api folder when you fork the meta’s collection in postman.

couldn’t’ve have done it without you guys @pachocastillosr @NigelG thanks a bunch!

[b.t.leone1992]

@omarhendy glad to hear that you solved this issue! If possible, could you describe it with prints? I couldn’t understand what you mean with “make a new post request with the body being the body of “view message” found in the api folder when you fork the meta’s collection in postman.”. Did you found this documentation in Whatsapp API Reference?