How to Integrate FlutterFlow with Zapier Using Webhooks

In Zapier, click Create Zap. In the Trigger step, search for and select Webhooks by Zapier. Choose the Catch Hook trigger event. Click Continue. Zapier generates a unique webhook URL — copy it, it will look like https://hooks.zapier.com/hooks/catch/123456/abcdefg/. Do not click Test yet. Leave this Zap open in your browser while you set up FlutterFlow. This URL is the endpoint your FlutterFlow app will POST data to whenever the trigger event fires.

In FlutterFlow, go to API Manager in the left sidebar. Click Add API Group. Name it ZapierWebhooks. Set the Base URL to https://hooks.zapier.com. Leave auth as None — Zapier webhook URLs are unguessable by design. Add one API Call inside the group named triggerFormSubmit. Set Method to POST. Set the path to /hooks/catch/123456/abcdefg/ — the exact path from your Zapier URL. In the Body tab, select JSON. Add the fields you want to pass to Zapier: for a contact form use keys like name, email, message, submitted_at. Set each value type to Variable so you can bind to page state variables at call time. Click Test to send a sample payload — verify Zapier receives it in the trigger step.

Navigate to the widget or action flow where you want to trigger Zapier (for example, a form Submit button). Open the Action Flow Editor. Add a Backend Call action → select API Call → choose ZapierWebhooks → triggerFormSubmit. In the call's variable bindings, map each JSON field to the corresponding page state variable: name → Page State name, email → Page State email, message → Page State message, submitted_at → Global property current time (formatted as ISO 8601). Add a Show Snackbar action after the API Call to confirm submission to the user. The entire flow fires every time the button is pressed, sending fresh data to Zapier each time.

Back in Zapier, after confirming the trigger received test data, click Continue to the Action step. Search for your target app — Google Sheets, Gmail, Slack, or any other. For Google Sheets example: select Google Sheets → Create Spreadsheet Row. Connect your Google account. Choose the target spreadsheet and worksheet. In the row field mapping, insert the trigger data fields (name, email, message, submitted_at) into the appropriate columns using Zapier's dynamic field insertion. Click Test Action to verify a row is created. Then click Publish Zap. The Zap is now live and every FlutterFlow webhook call creates a row in your sheet.

For the reverse direction — Zapier pushing data INTO your FlutterFlow app — you need a Cloud Function as the receiving server. In Firebase Console, create an HTTPS Cloud Function named zapierInbound. The function receives a POST request from Zapier with a JSON body. It writes the payload to Firestore collection zapier_events with a timestamp and status field. In Zapier, add a new Zap where the action step is Webhooks by Zapier → POST. Set the URL to your Cloud Function's HTTPS URL. Set the Payload Type to JSON. Map the Zapier trigger data to the POST body fields. In FlutterFlow, add a Backend Query (real-time, set to listen for changes) on the relevant page, querying zapier_events ordered by timestamp descending. The UI updates automatically when Zapier fires.

1// Cloud Function: zapierInbound
2// receives POST from Zapier → writes to Firestore
3const functions = require('firebase-functions');
4const admin = require('firebase-admin');
5
6exports.zapierInbound = functions.https.onRequest(async (req, res) => {
7  if (req.method !== 'POST') {
8    return res.status(405).send('Method Not Allowed');
9  }
10  const payload = req.body;
11  await admin.firestore().collection('zapier_events').add({
12    ...payload,
13    receivedAt: admin.firestore.FieldValue.serverTimestamp(),
14    status: 'received'
15  });
16  return res.status(200).json({ success: true });
17});

In Zapier, go to Zap History in the left sidebar. Each execution shows status (success, error, held), timestamp, and the exact data that flowed through each step. If a step errors, click the failed task to see the error message and the input data at that step. Common issues: FlutterFlow sends an empty payload (check variable bindings in Action Flow), Zapier can't authenticate to the target app (reconnect the account in Zapier), or the target field mapping is wrong (check field types match, e.g., dates must be ISO 8601). For rate limiting: Zapier free tier runs Zaps every 15 minutes — upgrade to a paid plan for real-time execution.