Adrian Payne | Frontend Dev Blog

Adrian Payne
Frontend Engineer

Who am I?

Adrian spends most of his time being a Senior Frontend Engineer in Hamburg. When he's not doing that, he likes to sing and play hurling with Hamburg GAA.

What I write about

Why the domain?

I'm a frontend developer and I'm from Ireland :)

Recent Posts

Sign up for an awesome Lootcrate!

Using Netlify Functions to Delete Form Submissions

Want to use Netlify Forms but don't want the submissions to remain on Netlify after they've been forwarded to you? Let's dive in to how we can achieve this using Netlify Functions.

Netlify Forms are an amazing addition to the static site ecosystem. They're easy to set up and offer great features like spam protection and submission forwarding to an email of your choice for free!

The GDPR Problem

One thing that kept me up at night about the forms feature was the thought of personally identifiable information (PII) like customer name, email address and telephone number continuing to exist on a Netlify server after the form submission had been forwarded to my email account using Netlify Form notifications. Sure I could manually delete the submissions via the UI after a GDPR retention period but I would much rather deletion was automated.

How to automate form deletion on Netlify?

Enter Netlify Functions. These offer the ability to deploy serverless/lambda functions, which are deployed along with the rest of your Netlify site. The great thing about these is that they abstract away all the under the hood AWS management boredom and offer you a simple way to create and use a lambda function.

Environment variables are available and Netlify offers a generous collection of event-based triggers, which we are going to take advantage of. Specifically submission-created, which will call our lambda function when a user successfully sends a 'verified' submission via a form. We'll also use the Netlify API to do our deleting.

As of writing this, the submission-created event does not fire on preview deploy. You can locally test your function using netlify dev, which I won't go into here, but to test it in production, you will need to test it on your live site.

Let's get started

This guide assumes you already have an existing site deploying to Netlify and have already set up a Netlify Form which is collecting submissions.

Note: When we trigger our function later, it will delete ALL form submssions from ALL forms on your site and it will do this every time a form is submitted on your site. Back submissions up now, if you need to.

We're going to tackle this in 3 parts

  1. Get a Netlify API Access Token
  2. Creating the function in your project
  3. Check that the function deploys and works

1. Netlify API Access Token

As we're going to make use of the Netlify API, we're going to need to get an access token for it and then add that token as a Netlify environment variable.

Showing a created Netlify personal access token

  • Next, Log in to your Netlify account and select your site.
  • Go to Settings > Build & Deploy > Environment
  • Click New variable and name it NETLIFY_API_ACCESS_TOKEN
  • Paste the API token as the value and click Save
This access token is a private token. Do not share it with anybody and do not commit it to your repo. You also only get to see it once. If you lose it, you'll need to create another.

Showing where environment variables are saved in Netlify admin UI

2. Create the function

Tell Netlify where to find our function

We haven't created the function yet but in order for Netlify to know where to find our function, we're going to need to explicitly tell it the location. To do this, we're going to create a Netlify build config file. If you're interested, you can read more about File-based configuration here.

  • Create a new file in the root of your project and name it netlify.toml
  • Paste the following into the file and save it.

    functions = "functions"

Create the function file

  1. Create a new folder in the root of your project and name it functions. This should sound crazily familiar because we just told Netlify the name of this folder in the previous step.

  2. Inside our functions folder, create a new file called submission-created.js. Normally, you can name a function whatever you like but as we want to use an event based trigger, the file must be named the same as event trigger submission-created. See other event triggers.

  3. Here's the function code. You can copy-paste it into your submission-created.js file. I won't tell anyone.

In short, we're connecting to the Netlify API to first get an array of all submissions from every form on our site. Then we loop through that array, using the API to delete each submission. If you want to delete submissions from only a specific form, you'll want to refactor the function to integrate listForms and listFormSubmissions instead of listSiteSubmissions.

The sharp eyed amongst you may have noticed a second environment variable here - process.env.SITE_ID - and that we didn't declare it. This is one of Netlify's built-in env vars so we don't need to. It's the ID specific to your site on Netlify.
const NetlifyAPI = require('netlify')

exports.handler = async function (event, context) {
  const client = new NetlifyAPI(process.env.NETLIFY_API_ACCESS_TOKEN)

  const submissions = await client
      site_id: process.env.SITE_ID,
    .catch((e) => console.log('Error getting submissions', e))

  if (submissions.length) {
    for (i = 0; i < submissions.length; i++) {
      await client.deleteSubmission({ submission_id: submissions[i].id })
    return {
      statusCode: 200,
      body: 'Submissions deleted',
  } else {
    return {
      statusCode: 200,
      body: 'No submissions to delete',

Set up our 'netlify' dependency

We're requiring netlify as a dependency in line 1 of our code but have yet to install it. Functions live their own little lives and need their own dependencies. Let's take care of that now.

  • Install the netlify-lambda package as a dev dependency in your project's main package.json. This offers a whole suite of stuff to deploy and test Netlify functions but we'll just use a part of it here.
yarn add -D netlify-lambda
  • Add the following command under the "scripts" section of your project's main package.json. Netlify will run this during the build to install any function specific dependencies. It will install the dependencies into the folder we designated in the netlify.toml file we created earlier.
"postinstall": "netlify-lambda install"
  • Finally, create a package.json file inside our functions folder and paste in the following so that Netlify knows what to install for our function.
  "dependencies": {
    "netlify": "^4.3.13"

That's it for the coding part!

3. Test that it works

We're in the final stretch! Now we need to deploy and test that it's working. I recommend having a couple of form submissions already sitting in Netlify ready to be deleted by our function. This just makes it easier to see that the function has done it's thing.

  • Commit the changes and push them up to trigger a new build. As of writing this, the submission-created event does not fire on Preview Deploys so you will need to push the changes live and use the live URL to test.
Depending on your stack, your deploy method might differ to mine so do what you need to do to trigger a build with the new code and deploy it live.
  • Open the build log of your new deploy. We're looking for two things here to confirm that the function has been picked up by Netlify - the function specific dependency was installed and Netlify found the function file. See the screenshots below.

Showing the build log and that it installed our 'netlify' dependency

Showing that Netlify located and packaged our new function

  • Once the deploy has completed successfully and deployed live, open up a page on your site with a Netlify form and submit it.
  • Go back into the Netlify admin dashboard and to the Forms section.
  • Select a form and you shouldn't see any verified submissions!

    Showing no form submissions on the dashboard

Not working?

If you've used Netlify Functions before, you'll know that you can find them under the Functions section of the Netlify dashboard. However, this is not always the case for event based trigger functions. If you're lucky, the function will show here and you might be able to locate a problem via the logs.

Some other things to check...

  • Check that you are testing the function on the live site (not a deploy preview)
  • Check that the NETLIFY_API_ACCESS_TOKEN environment variable has been correctly set. If you're not sure, you'll have to create a fresh one.
  • Check that the netlify.toml configuration points to the correct location of the function.
  • Check that the function file is named submission-created.js
  • Check that the "postinstall" command is in the right place (under "scripts") in your project's main package.json file.

Still not working?

I've created a repo with an example of the setup. It's using Next.js but the setup should be extremely similar for other jamstack options. You can find it at

Posted in netlify, nextjs, lambda functions on by

Share this post:
This site is run on Digital Ocean. Sign up for yours!