Creating An App On Zapier

I figured something out, not with OAuth 2 (I’ll keep trying), but with Session OAuth, which seems good enough since it allows to offer the Zapier app in a self-service manner like OAuth 2.

From a user standpoint the difference with Session OAuth is that the authorization screen is hosted by Zapier.

From a technical standpoint, Zapier stores your user’s Bubble email and Bubble password in order to refresh the Bubble authentication token when needed. So if the user changes their password in the Bubble app, it will break the Bubble <> Zapier connexion.

Anyway, here’s how I did it with Session OAuth (as you will see, the OAuth part is only half the battle).

It’s a bit tedious, so I’ve tried to structure the whole thing and provide a lot of screenshots rather than doing a lot of writing. Hopefully what I don’t cover in details is very obvious.

AUTHENTICATION

1.1 - Collect user credentials

After you’ve created your Zapier app here and selected Session OAuth for the authentication method, you’ll need to collect the user’s email and password (of their Bubble app account).

1.2 - Create your token endpoint in Bubble and configure the call in Zapier

The endpoint should be able to run without authentication (since at this point they are not logged in yet)

In Zapier you really only need those two fields, you can remove all the rest that they add by default.

1.3 - Create a test endpoint (e.g., “me”) in Bubble and configure the test call in Zapier

This endpoint should NOT be able to run without authentication (the very purpose of this endpoint is to verify that the authentication works).

I’m “returning some data from the API” just for test purposes, but that isn’t mandatory. This is the way to go though when you call a workflow endpoint later with your Zapier triggers/actions.

image

In Zapier, you ONLY need to specify the token as a header parameter, you can remove the email/password that Zapier adds by default. The token is retrieved with the following expression (This is because the token we get from Bubble is nested in the “response” object):

{{bundle.authData.reponse.token}}


Nb: do not forget to add "Bearer ".

You can now test your authentication :tada:

Everytime a call returns a 401 error (token expired), Zapier will do a call to the token endpoint again to get a new token (hence the need to save the username and password in Zapier).

2 - TRIGGERS

Let’s add a trigger for when there’s a new record in our database (for a specific custom data type) using the Data API.

2.1 - Expose your Data API in Bubble

2.2 - Settings

Define whatever you want. No trick here.

2.3 - Input designer

You can skip that, we don’t need the user to specify anything.

2.4 - Configure the API call

This one is a tad tricky and we’ll need to switch to Code Mode for 2 reasons:

  • To specify that the results provided by the Data API are nested under “response” and “results”;
  • To parse the “_id” provided by Bubble and change that to “id” expected by Zapier (I had to ask a developer on how to do that ^^).

That’s it, test that everything works well and define your output fields.

3 - ACTIONS

That’s the easiest part :slight_smile:

3.1 - Add privacy rules in Bubble

While we were fine with no privacy rules for reading data, you’ll need privacy rules in place in order to allow users to create data! If you skip this step you’ll get an “unauthorized” error.

Nb: in case you want to use the Workflow API, you can refer to 1.3 to see how to return data.

3.2 - Settings

Specify whatever you like here

3.3 - Input designer

Define the record info. Beware that the name of the key should exactly match the field name of your Bubble database.

3.4 - Configure your API call

You’ll need the Authorization parameter in the header again.

And the input values in the body:

That’s it, there’s no need to parse anything. You can test and define your output fields :tada:

You’re ready to roll, grab your invite url in the sharing section :sunglasses:

12 Likes