AJAX / fetch form

JavaScript submit without a full page reload.

Keys required. Create a site in the dashboard and copy your site key (HTML) and secret key (server). Replace sq_live_your_key in the snippets below.

How this integration works

Same three steps as every other platform — only the paste location and server hook change.

StepWhat you do for AJAX / fetch form
1 Prevent default submit, call widget.execute() to get a token.
2 Send the token in your fetch/axios JSON body as squeaker-token.
3 Verify on the server before processing.

Recommended settings

SettingValue
Widget mode Auto (recommended) — Runs on form submit — best for most forms
Form ID #contact-form
Server verify Node.js, PHP, Python

Important notes

Copy-paste snippet

Paste into your AJAX / fetch form form or template. Load squeaker.js once per page.

<squeaker-widget
  data-sitekey="sq_live_your_key"
  data-api="https://api.squeaker.cc/v1"
  data-mode="auto"
  data-theme="light"
  data-form="#contact-form"
></squeaker-widget>
<script src="https://cdn.squeaker.cc/squeaker.js" async defer></script>

<script>
  const widget = document.querySelector('squeaker-widget');

  document.getElementById('contact-form').addEventListener('submit', async (e) => {
    e.preventDefault();
    const token = await widget.execute();
    await fetch('/api/contact', {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify({ email: '...', 'squeaker-token': token }),
    });
  });
</script>

Server verification

Read squeaker-token from the request and POST to /v1/verify with your secret key. Full reference: Server verify docs.

// In your form handler — no npm package required
const apiUrl = process.env.SQUEAKER_API_URL ?? 'https://api.squeaker.cc/v1';
const token = req.body['squeaker-token'];
if (!token) return res.status(400).json({ error: 'Missing token' });

const verifyRes = await fetch(`${apiUrl}/verify`, {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify({
    secret: process.env.SQUEAKER_SECRET,
    token,
    remoteip: req.ip,
  }),
});
const result = await verifyRes.json();
if (!result.success) {
  return res.status(403).json({ error: result.error ?? 'Invalid token' });
}

// Token valid — process the form

Open setup generator with AJAX / fetch form pre-selected · Browse all platforms