Skip to main content

​
Overview

This Stripe connection allows you to enhance your ad performance and attribution on Meta.

​
How It Works

When a customer completes an action in Stripe (e.g., a purchase, renewal, upgrade, etc.), our system securely processes this event and forwards it to Meta’s Conversions API for improved ad attribution.

​
Prerequisites

Before setting up the integration, you’ll need:
  • A Stripe account with webhook access
  • Meta Pixel ID
  • Meta Access Token
  • Meta Pixel set up on your landing page and app

​
Step 1: Provide Meta Pixel Settings

  1. Meta Pixel ID: Find this in your Meta Events Manager
  2. Meta Access Token: Generate this in your Meta Business Settings under System Users

​
Step 2: Set Up Webhook

Configure a webhook endpoint in your Stripe Dashboard to enable automatic event forwarding:
  1. Go to Stripe Webhooks
  2. Click Add endpoint
  3. Enter webhook URL: https://meta-tracking.loops.fi/api/chatbase/webhooks/stripe
  4. Select all events or choose specific events you want to track
  5. Copy the webhook signing secret for later use

​
Step 3: Enhance Your Data with Customer Metadata

To help Meta accurately attribute conversions to your ads, you need to send additional customer data. This data is collected in two ways:

​
Server-Side Data: IP Address and User Agent

Your server automatically receives the customer’s IP address and user agent with every API request. Extract these values and include them when creating a Stripe Customer: 
// On your server's API endpoint (e.g., /api/create-checkout)
app.post('/api/create-checkout', (req, res) => {
  const client_ip = req.ip || req.headers['x-forwarded-for'];
  const client_user_agent = req.headers['user-agent'];
  // ... pass these to Stripe Customer metadata
});

​
Client-Side Data: _fbc and _fbp Cookies

These cookies are stored in the user’s browser by Meta. Your website’s frontend JavaScript needs to read these cookies and send them to your backend. Get cookies on the client side: Add this helper function to your client-side JavaScript: 
function getCookie(name) {
  const value = `; ${document.cookie}`;
  const parts = value.split(`; ${name}=`);
  if (parts.length === 2) {
    return parts.pop().split(';').shift();
  }
}
Send cookie data to your server: When a user initiates a checkout, read the cookies and send them to your backend API: 
async function handleCheckout() {
  const fbc = getCookie('_fbc') || null;
  const fbp = getCookie('_fbp') || null;

  const response = await fetch('/api/create-checkout', {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({ fbc, fbp, /* ... other data */ }),
  });
  // ... handle response and redirect
}

​
Putting It All Together

Your server will now receive all the necessary information. Here’s how to combine it and create a Stripe Customer with all the Meta CAPI metadata: 
// On your server (e.g., in Express) - Your /api/create-checkout endpoint
app.post('/api/create-checkout', async (req, res) => {
  try {
    // 1. Get Server-Side Data (from headers)
    const client_ip = req.ip || req.headers['x-forwarded-for'];
    const client_user_agent = req.headers['user-agent'];

    // 2. Get Client-Side Data (from request body)
    const { fbc, fbp } = req.body;

    // 3. Create Stripe Customer with Metadata
    const customer = await stripe.customers.create({
      // email: ... (include customer email if available)
      metadata: {
        client_ip: client_ip || '',
        client_user_agent: client_user_agent || '',
        fbc: fbc || '',
        fbp: fbp || '',
      }
    });

    // 4. Create Checkout Session
    const session = await stripe.checkout.sessions.create({
      customer: customer.id,
      // ... other session parameters like line_items
      metadata: {
        event_source_url: "https://yoursite.com/checkout"
      }
    });

    // 5. Send the session URL back to the client
    res.json({ url: session.url });
  } catch (error) {
    res.status(500).json({ error: error.message });
  }
});
This complete flow ensures that when a customer.created or checkout.session.completed webhook is triggered, the associated Stripe Customer will contain all the required Meta CAPI metadata for improved ad attribution.

​
Next Steps

Once configured, your Stripe conversion events will automatically be sent to Meta’s Conversions API, helping you:
  • Improve ad targeting accuracy
  • Measure campaign performance more effectively
  • Optimize your ad spend based on actual conversion data