Constant Contact

Navigate to developer.constantcontact.com in your browser and sign in with your Constant Contact account. Go to the My Applications section and click Create Application. Give the app a name (for example, 'FlutterFlow Integration') and set the Redirect URI to a URL you control — this can be a simple Firebase Hosting page or even a localhost URL for the one-time setup (for example, `https://your-project.web.app/oauth-callback`). Constant Contact will redirect to this URL with the authorization code after the user approves the OAuth consent screen. Save the application and note the `client_id` and `client_secret` — you will add these to Firebase Secret Manager, never to FlutterFlow. To get your initial access token and refresh token, complete the OAuth-2 authorization code flow manually: construct the authorization URL using the Constant Contact V3 OAuth documentation (base: `https://authz.constantcontact.com/oauth2/default/v1/authorize`), visit it in your browser, approve the scopes (contact_data, campaign_data if needed), and note the `code` parameter that appears in the redirect URL. Then make a POST request to `https://authz.constantcontact.com/oauth2/default/v1/token` with your client credentials and the authorization code to exchange it for an access token and refresh token. Store both tokens in your Firebase Firestore under a protected collection (for example, `_cc_oauth/tokens`) — they are the starting point for the Cloud Function's automatic refresh cycle. Also note your Constant Contact list ID: in the Constant Contact dashboard go to Contacts → Lists, click on the list you want to use, and copy the list ID from the URL or the list details panel. This ID will be passed as a variable from FlutterFlow.

This Cloud Function has two jobs: keep the Constant Contact access token fresh, and accept add-contact requests from FlutterFlow. Open the Firebase console, confirm your project is on the Blaze plan, and deploy the function using the Firebase CLI or the console's inline editor. The function reads the stored access token from Firestore. If the token is within 5 minutes of its expiry time, it calls the Constant Contact token refresh endpoint (`POST /oauth2/default/v1/token` with `grant_type=refresh_token`) using the stored refresh token and client credentials from Firebase Secret Manager. The refreshed access and refresh tokens are written back to Firestore. The function then calls `POST /v3/contacts` on the Constant Contact API with a contact upsert payload — setting `create_source` to 'Account', the email address, and the list ID — and returns the result to FlutterFlow. Set the client credentials using Firebase Secrets: run `firebase functions:secrets:set CONSTANT_CONTACT_CLIENT_ID` and `firebase functions:secrets:set CONSTANT_CONTACT_CLIENT_SECRET` from the Firebase CLI. The tokens in Firestore should be protected by a security rule that denies all client-side reads and writes — only the Cloud Function admin SDK can access them. Once deployed, copy the Cloud Function's HTTPS trigger URL from the Firebase console. This URL is what you will use as the Base URL in the FlutterFlow API Call group.

1const functions = require('firebase-functions');
2const admin = require('firebase-admin');
3
4admin.initializeApp();
5
6const CC_TOKEN_URL = 'https://authz.constantcontact.com/oauth2/default/v1/token';
7const CC_API_BASE = 'https://api.cc.email/v3';
8
9async function getValidAccessToken() {
10  const tokenDoc = await admin.firestore()
11    .collection('_cc_oauth').doc('tokens').get();
12
13  if (!tokenDoc.exists) {
14    throw new Error('CC tokens not initialised. Complete OAuth-2 setup first.');
15  }
16
17  const { access_token, refresh_token, expires_at } = tokenDoc.data();
18  const now = Date.now();
19
20  // Refresh if within 5 minutes of expiry
21  if (now >= (expires_at - 5 * 60 * 1000)) {
22    const clientId = process.env.CONSTANT_CONTACT_CLIENT_ID;
23    const clientSecret = process.env.CONSTANT_CONTACT_CLIENT_SECRET;
24
25    const basicAuth = Buffer.from(`${clientId}:${clientSecret}`).toString('base64');
26
27    const refreshResponse = await fetch(CC_TOKEN_URL, {
28      method: 'POST',
29      headers: {
30        Authorization: `Basic ${basicAuth}`,
31        'Content-Type': 'application/x-www-form-urlencoded',
32      },
33      body: new URLSearchParams({
34        grant_type: 'refresh_token',
35        refresh_token,
36      }),
37    });
38
39    if (!refreshResponse.ok) {
40      const err = await refreshResponse.text();
41      throw new Error(`Token refresh failed: ${err}`);
42    }
43
44    const newTokens = await refreshResponse.json();
45    await admin.firestore().collection('_cc_oauth').doc('tokens').set({
46      access_token: newTokens.access_token,
47      refresh_token: newTokens.refresh_token || refresh_token,
48      expires_at: Date.now() + (newTokens.expires_in * 1000),
49    });
50
51    return newTokens.access_token;
52  }
53
54  return access_token;
55}
56
57exports.constantContactProxy = functions
58  .runWith({ secrets: ['CONSTANT_CONTACT_CLIENT_ID', 'CONSTANT_CONTACT_CLIENT_SECRET'] })
59  .https.onRequest(async (req, res) => {
60    res.set('Access-Control-Allow-Origin', '*');
61    if (req.method === 'OPTIONS') {
62      res.set('Access-Control-Allow-Methods', 'POST');
63      res.set('Access-Control-Allow-Headers', 'Content-Type');
64      return res.status(204).send('');
65    }
66
67    if (req.method !== 'POST') {
68      return res.status(405).json({ error: 'Method not allowed' });
69    }
70
71    const { email, list_id, first_name, last_name } = req.body;
72
73    if (!email || !list_id) {
74      return res.status(400).json({ error: 'email and list_id are required' });
75    }
76
77    try {
78      const token = await getValidAccessToken();
79
80      const contactPayload = {
81        email_address: { address: email, permission_to_send: 'implicit' },
82        create_source: 'Account',
83        first_name: first_name || '',
84        last_name: last_name || '',
85        list_memberships: [list_id],
86      };
87
88      const ccResponse = await fetch(`${CC_API_BASE}/contacts`, {
89        method: 'POST',
90        headers: {
91          Authorization: `Bearer ${token}`,
92          'Content-Type': 'application/json',
93          Accept: 'application/json',
94        },
95        body: JSON.stringify(contactPayload),
96      });
97
98      // 409 = contact already exists — treat as success in the app
99      if (ccResponse.status === 201 || ccResponse.status === 409) {
100        return res.status(200).json({ success: true, status: ccResponse.status });
101      }
102
103      const errorBody = await ccResponse.text();
104      console.error('Constant Contact error:', ccResponse.status, errorBody);
105      return res.status(ccResponse.status).json({ error: errorBody });
106    } catch (err) {
107      console.error('Function error:', err);
108      return res.status(500).json({ error: err.message });
109    }
110  });

In FlutterFlow, click API Calls in the left navigation panel and click + Add → Create API Group. Name it ConstantContactProxy. In the Base URL field paste the HTTPS trigger URL of your deployed Cloud Function. Do not add any Authorization header to the API Group — all authentication is handled inside the function. Inside the group, click + Add to create an API Call. Name it AddContact. Set the method to POST. Leave the endpoint path empty (the Cloud Function URL is the full endpoint). Navigate to the Body tab and set the body type to JSON. Add the following JSON body: ```json { "email": "{{email}}", "list_id": "{{list_id}}", "first_name": "{{first_name}}", "last_name": "{{last_name}}" } ``` In the Variables tab add four variables: `email` (String, required), `list_id` (String, default = your Constant Contact list ID), `first_name` (String, optional), and `last_name` (String, optional). Setting the list_id as a default value means you do not need to pass it explicitly in every FlutterFlow action — the correct list is always used. Go to Response & Test. Enter a real email address (use your own for testing) and your list ID, then click Test API Call. If the Cloud Function and Constant Contact setup are correct, you will see a 200 response with `{"success": true}` and the contact will appear in your Constant Contact list within a few seconds. If you run the test again with the same email, you will still see `{"success": true}` with `{"status": 409}` — confirming the duplicate-handling logic works. Save the API Call.

1{
2  "api_group": "ConstantContactProxy",
3  "base_url": "https://us-central1-YOUR_PROJECT.cloudfunctions.net/constantContactProxy",
4  "calls": [
5    {
6      "name": "AddContact",
7      "method": "POST",
8      "body_type": "JSON",
9      "body": {
10        "email": "{{email}}",
11        "list_id": "{{list_id}}",
12        "first_name": "{{first_name}}",
13        "last_name": "{{last_name}}"
14      },
15      "variables": [
16        { "name": "email", "type": "String", "required": true },
17        { "name": "list_id", "type": "String", "default": "YOUR_CC_LIST_ID" },
18        { "name": "first_name", "type": "String", "default": "" },
19        { "name": "last_name", "type": "String", "default": "" }
20      ]
21    }
22  ]
23}

Now connect the API Call to a real user action in your FlutterFlow app. The most common trigger is a button on a sign-up or onboarding screen, but the same action works on a settings toggle, a post-purchase confirmation button, or any other widget. For a standalone newsletter sign-up form: add a TextField widget for the email address, a TextField for the optional first name, and a Button labelled 'Subscribe'. In the Button's action flow, click + Add Action → Backend/Database → API Request → ConstantContactProxy → AddContact. Bind the `email` variable to the email TextField's value. Bind `first_name` to the name TextField's value. Leave `list_id` empty (it uses the default you set). After the API Call action, add a conditional check: if the response status is 200 (success), navigate to a confirmation screen or show a SnackBar with 'You're subscribed!'. If the status is not 200, show an error SnackBar with a message. For a sign-up opt-in checkbox during account creation: add a Checkbox widget to the registration screen with a label like 'Subscribe to our weekly newsletter'. After the 'Create Account' action succeeds, add a conditional action: if the checkbox is checked, fire the AddContact API Call with the email the user just registered with. This pattern adds email marketing in exactly two extra actions without disrupting the core sign-up flow. Set an `isLoading` Boolean Page State variable to true before the API Call and false after. Bind the Button's loading state to this variable so it shows a spinner during the Cloud Function call. The round-trip is typically under 2 seconds, but a loading indicator prevents double-taps.

Three operational realities need to be handled in production to keep the integration reliable for weeks and months after launch. First, token expiry and refresh: The Cloud Function in Step 2 handles automatic token refresh, but the refresh token itself eventually expires (typically 60 days of inactivity for Constant Contact). If the refresh token expires, the Cloud Function will return a 401 or 500 error with a message like 'CC tokens not initialised' or 'Token refresh failed'. Build a monitoring strategy: log every token refresh event in Firebase, and set up a Firebase Cloud Monitoring alert if the Cloud Function error rate spikes. When this happens, a developer needs to complete the OAuth-2 flow manually again (Step 1) and update the tokens in Firestore. Second, plan limits: Constant Contact's free trial has API endpoint limits that may prevent testing at scale. Full API features including multi-list management require a Business or higher plan. If your add-contact calls return 403 errors, check whether your account has the required plan level. Third, the 409 duplicate-contact case: the Cloud Function already converts 409 into a 200 success, but ensure your FlutterFlow success UI message works for both cases. 'You're subscribed!' is accurate for a new subscriber and neutral for someone already subscribed. Avoid messages like 'Successfully added!' that imply a new record was created when the contact already existed.