Embed tokens and API keys

Two token types

Which one to use

Embed tokens

Create an embed token

1. In your dashboard, click Embed Tokens
2. Click Create token
3. Name it (e.g., "Main website" or "Contact page")
4. Optionally set allowed domains
5. Click Create
6. Copy the full token starting with cf_embed_

Use an embed token

In a hidden field (HTML form):

<input type="hidden" name="_token" value="cf_embed_your_token_here" />

In a fetch request:

const data = new FormData();
data.append('_token', 'cf_embed_your_token_here');
data.append('name', 'Alice');
data.append('email', '[email protected]');

await fetch('https://my.contactfire.com/api/form/submit', {
  method: 'POST',
  body: data,
});

In the JS embed script attribute:

<script
  src="https://my.contactfire.com/api/embed-script"
  data-token="cf_embed_your_token_here"
  data-form-id="your_form_id"
  async
></script>

API keys

Create an API key

1. In your dashboard, click API Keys
2. Click Create key
3. Name it (e.g., "Backend integration")
4. Click Create
5. Copy the full key — it is only shown once

Use an API key

Send the key in the x-api-key header:

// Node.js example
const res = await fetch('https://my.contactfire.com/api/form/submit', {
  method: 'POST',
  headers: {
    'x-api-key': process.env.CONTACTFIRE_API_KEY, // cf_api_...
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({
    name: 'Alice',
    email: '[email protected]',
    message: 'Hello from the backend',
  }),
});

const result = await res.json();
// { status: 'success', message: 'Submission received', submissionId: 'abc123' }

Domain restrictions (embed tokens)

Restrict an embed token to specific domains. Submissions from unlisted origins are rejected with a 403 response.

Recipient overrides

Both token types support custom notification recipients. Useful when different tokens are used for different departments or clients.

Rotating and revoking