Mailchimp

In Mailchimp, click your account avatar (top right) → Account & billing → Extras → API keys. If you have no existing keys, click Create A Key and give it a descriptive name like 'FlutterFlow Integration'. Copy the full API key — it looks like a32b4c5d6e7f8a9b0c1d2e3f4a5b6c7d8-us14. The critical part is the two-part suffix at the end: the characters after the last hyphen ('us14' in this example) are your data center identifier. This determines your API base URL. Write down two things: (1) the complete API key — keep it safe, this is the credential; (2) the data center suffix — 'us14', 'us6', 'us2', etc. Your Mailchimp API base URL is https://{dc}.api.mailchimp.com/3.0 where {dc} is your suffix. For us14 that becomes https://us14.api.mailchimp.com/3.0. Now also get your Audience List ID: in Mailchimp go to Audience → All Contacts → Settings → Audience name and defaults. The Audience ID is a string like 'abc123def4' displayed under the audience name. Copy it — you will use it in the API endpoint path when subscribing members. You can have multiple audiences; each has its own List ID.

Create a Firebase Cloud Function that handles Mailchimp subscriber operations. The function must construct the Basic Auth header by base64-encoding 'anystring:YOUR_API_KEY' and prefix the Mailchimp URL with the correct data-center subdomain — both values come from environment variables. The function accepts a POST from FlutterFlow with an operation type and subscriber email, then routes the request to the appropriate Mailchimp endpoint. Important CORS note: include Access-Control-Allow-Origin headers because FlutterFlow web builds run in a browser. For the subscribe operation, POST to /lists/{list_id}/members with the body { email_address, status }. For campaigns, GET /campaigns with query parameters for pagination and sorting. The status value is critical — if your Mailchimp audience has double opt-in enabled (the default for most new audiences), you must use 'pending' not 'subscribed'. Sending 'subscribed' to a double-opt-in audience returns a 400 error. Deploy with the Firebase CLI from your local machine and set the MAILCHIMP_API_KEY and MAILCHIMP_DC (the data-center like 'us14') as environment variables using Firebase Secret Manager or config.

1// functions/index.js (Firebase Cloud Functions)
2const functions = require('firebase-functions');
3const fetch = require('node-fetch');
4
5exports.mailchimpProxy = functions.https.onRequest(async (req, res) => {
6  res.set('Access-Control-Allow-Origin', '*');
7  res.set('Access-Control-Allow-Methods', 'POST, OPTIONS');
8  res.set('Access-Control-Allow-Headers', 'Content-Type');
9  if (req.method === 'OPTIONS') { res.status(204).send(''); return; }
10
11  const API_KEY = process.env.MAILCHIMP_API_KEY;
12  const DC = process.env.MAILCHIMP_DC; // e.g. 'us14'
13  const BASE_URL = `https://${DC}.api.mailchimp.com/3.0`;
14  const AUTH = 'Basic ' + Buffer.from(`anystring:${API_KEY}`).toString('base64');
15
16  const { operation, list_id, email, status, merge_fields } = req.body;
17
18  const headers = {
19    'Authorization': AUTH,
20    'Content-Type': 'application/json'
21  };
22
23  let endpoint, method, body;
24
25  switch (operation) {
26    case 'subscribe':
27      endpoint = `/lists/${list_id}/members`;
28      method = 'POST';
29      body = JSON.stringify({
30        email_address: email,
31        status: status || 'subscribed',
32        merge_fields: merge_fields || {}
33      });
34      break;
35    case 'list_campaigns':
36      endpoint = '/campaigns?count=10&sort_field=send_time&sort_dir=DESC';
37      method = 'GET';
38      break;
39    default:
40      res.status(400).json({ error: 'Unknown operation' });
41      return;
42  }
43
44  const mcRes = await fetch(`${BASE_URL}${endpoint}`, { method, headers, body });
45  const data = await mcRes.json();
46  res.status(mcRes.status).json(data);
47});
48

In FlutterFlow, open API Calls in the left nav and click + Add → Create API Group. Name it MailchimpProxy. Paste your Firebase Cloud Function HTTPS trigger URL as the Base URL. Add no Authorization headers — the proxy handles auth. Create an API Call inside the group called subscribeUser. Set method to POST, leave the endpoint path blank. In the Body tab select JSON. Add these body variables: operation (String, default value 'subscribe'), list_id (String — your Mailchimp Audience List ID, or a variable if you have multiple audiences), email (String), status (String, default 'subscribed'), and merge_fields (String — a JSON object for custom merge tags, default '{}'). Your body template: { "operation": "{{operation}}", "list_id": "{{list_id}}", "email": "{{email}}", "status": "{{status}}", "merge_fields": {{merge_fields}} }. In Response & Test, fill in a real email address and your list_id, and click Test. A successful subscribe returns 200 with an id field — the unique hash of the subscriber. Now go to your sign-up or email capture screen. In the Action Flow Editor, after the form is submitted, add a Backend/API Call action selecting subscribeUser. Pass the user's email from the form field, the list_id as a constant (you can store it in App Values), and status as 'subscribed' or 'pending' depending on your audience's opt-in settings. Add a Snackbar action after the API Call: show 'Subscribed successfully!' on 200 and 'Subscription failed — please try again' on any other status.

1{
2  "operation": "{{operation}}",
3  "list_id": "{{list_id}}",
4  "email": "{{email}}",
5  "status": "{{status}}",
6  "merge_fields": {{merge_fields}}
7}

Create a second API Call in the MailchimpProxy group named listCampaigns. Set method to POST, leave the endpoint blank. Body: { "operation": "list_campaigns" }. In Response & Test, click Test. The response includes a campaigns array with objects containing each campaign's id, settings.subject_line, send_time, report_summary.open_rate, report_summary.click_rate, and status. Click Generate from Response to create JSON Paths. Create a Data Type called MailchimpCampaign with fields: campaignId (String), subjectLine (String), sendTime (String), openRate (Double), clickRate (Double), status (String). Map the JSON Paths: $.campaigns[*].id, $.campaigns[*].settings.subject_line, $.campaigns[*].send_time, $.campaigns[*].report_summary.open_rate, $.campaigns[*].report_summary.click_rate. Open rates and click rates come as decimals (0.245 = 24.5%) — use FlutterFlow's number formatting to display them as percentages by multiplying by 100. Build a Campaign Stats screen with a ListView bound to the listCampaigns Backend Query. In each list item, show the subject line as the title, the send date formatted to a readable string, and the open rate and click rate as percentage chips. This gives a founder or marketer a quick email performance overview from their FlutterFlow app without opening the Mailchimp dashboard.

Two edge cases require specific handling. First, double opt-in: if your Mailchimp audience requires confirmation emails (check Audience → Settings → Audience name and defaults → 'Enable double opt-in'), you must send status: 'pending' in the subscribe body, not 'subscribed'. Sending 'subscribed' to a double-opt-in audience returns a 400 error with 'Member in compliance state' or 'Invalid resource'. In FlutterFlow, let users choose or configure the default status per audience in your proxy. Second, bulk imports: if you want to sync a batch of existing app users to Mailchimp — for example, after adding Mailchimp to an app that already has 500 registered users — do not loop the subscribeUser API Call from FlutterFlow's device. Firing 500 API calls from the client app would exhaust Mailchimp's ~10-simultaneous-connection limit immediately. Instead, store the emails to sync in Firestore or Supabase, then trigger a Cloud Function that calls the Mailchimp batch endpoint (POST /batches) with an operations array. The batch endpoint accepts up to 500 operations per call and processes them asynchronously. If you need help building the bulk sync pipeline or multi-audience management for your app, RapidDev's team builds FlutterFlow integrations like this every week — reach out for a free scoping call at rapidevelopers.com/contact.

1// Bulk import via Mailchimp batch endpoint (Cloud Function, not FlutterFlow)
2async function batchSubscribe(emails, listId, auth, baseUrl) {
3  const operations = emails.map(email => ({
4    method: 'POST',
5    path: `/lists/${listId}/members`,
6    body: JSON.stringify({
7      email_address: email,
8      status: 'subscribed'
9    })
10  }));
11
12  const res = await fetch(`${baseUrl}/batches`, {
13    method: 'POST',
14    headers: { Authorization: auth, 'Content-Type': 'application/json' },
15    body: JSON.stringify({ operations })
16  });
17  return res.json();
18}
19// Call in batches of up to 500:
20const BATCH_SIZE = 500;
21for (let i = 0; i < allEmails.length; i += BATCH_SIZE) {
22  const batch = allEmails.slice(i, i + BATCH_SIZE);
23  await batchSubscribe(batch, LIST_ID, AUTH, BASE_URL);
24}
25