Spam filters

All form submissions are filtered for spam using Akismet, an industry leader in spam detection. Only submissions that pass the filter are included in your form's Verified submissions list in the form submissions UI. Submissions flagged as spam by Akismet can be found by switching to your form's Spam submissions list.

Tip

You can change the state of a submission from spam to verified or vice versa.

Extra spam prevention

For additional protection to help prevent abuse of your forms, you can add a honeypot field and/or a reCAPTCHA 2. We automatically reject submissions that do not pass these challenges. Junk submissions caught by a honeypot field or reCAPTCHA 2 won't even be included in your form's spam submissions. The Submissions page for a form will indicate if it has any extra spam prevention enabled.

Honeypot field

"Honeypot" fields are hidden form fields that lure bot users into completing a field that human users can't see. A form submitted with a completed honeypot field can be safely rejected because only a bot would see and complete the field. You can alert Netlify to a hidden honeypot field by adding a netlify-honeypot attribute to your <form> with the name of your hidden field. Then make sure that field is present in the form, but hidden via CSS or JavaScript.

Here's an example:

<form name="contact" method="POST" netlify-honeypot="bot-field" data-netlify="true">
  <p class="hidden">
    <label>Don’t fill this out if you're human: <input name="bot-field" /></label>
  </p>
  <p>
    <label>Email: <input type="text" name="email" /></label>
  </p>
  <p>
    <label>Message: <textarea name="message"></textarea></label>
  </p>
  <p>
    <button type="submit">Send</button>
  </p>
</form>

Now if someone enters any value in the bot-field, Netlify will quietly reject the form submission.

reCAPTCHA 2 challenge

If you would like to add a reCAPTCHA 2 challenge to a form, Netlify can include one for you, or you can add your own.

Netlify-provided reCAPTCHA 2

To have Netlify provide the CAPTCHA:

  1. Add a data-netlify-recaptcha="true" attribute to your <form> tag.
  2. In the place where you'd like the CAPTCHA to appear, add an empty <div> element inside your form with the same data-netlify-recaptcha="true" attribute.

When your site is published, the form will include the necessary HTML to render the CAPTCHA.

Here's an example:

<form name="contact" method="POST" data-netlify-recaptcha="true" data-netlify="true">
  <p>
    <label>Email: <input type="text" name="name" /></label>
  </p>
  <p>
    <label>Message: <textarea name="message"></textarea></label>
  </p>
  <div data-netlify-recaptcha="true"></div>
  <p>
    <button type="submit">Send</button>
  </p>
</form>

When a visitor submits the form, our servers will validate the CAPTCHA server-side. If the validation fails, we'll redirect the visitor back to the same page and reject the form submission.

Custom reCAPTCHA 2

You can also add your own reCAPTCHA 2 code in your site and let Netlify validate that form submissions come from a human. This is useful if you want to have more control over your validations, or you use a JavaScript library to inject a CAPTCHA in your forms.

In this case, Netlify needs your reCAPTCHA 2 site key and secret for validating that the captcha response is correct. You can provide these values via environment variables in your site settings. Use SITE_RECAPTCHA_KEY to set your site key, and SITE_RECAPTCHA_SECRET to set the secret provided by reCAPTCHA 2.

To set up a custom reCAPTCHA:

  1. Sign up for a reCAPTCHA API key pair and follow the instructions for adding reCAPTCHA to your site. This typically involves adding a script before the closing </head> of your HTML template, and a snippet at the end of the <form> where you want the reCAPTCHA widget to appear.

  2. Log in to your Netlify dashboard and add the following environment variables to your site’s Settings > Build & deploy > Environment > Environment variables panel:

    • SITE_RECAPTCHA_KEY with the reCAPTCHA API site key.
    • SITE_RECAPTCHA_SECRET with the reCAPTCHA API secret key.
  3. Add a data-netlify-recaptcha="true" attribute to the HTML form that has the custom reCAPTCHA widget.

    <form name="contact" method="POST" data-netlify-recaptcha="true" data-netlify="true">
      <!-- input fields and custom reCAPTCHA snippet -->
    </form>
    

The Netlify servers will check the submissions from that form, and accept them only if they include a valid g-recaptcha-response value.

If you submit your form via AJAX, make sure the g-recaptcha-response field is included in the body of the POST request.