Skip to content
Example of using VGS add-on for secure redacted form inputs
HTML
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
src
.gitignore
README.md
netlify.toml

README.md

Secure Forms with VGS deploy to netlify

Example of how to use Very Good Security Netlify add-on

Use cases

Using the vgs add-on you can collect and protect sensitive data.

Here are some use cases:

  • Collect credit card data in a PCI compliant manner
  • Protect personally identifiable information (PII) and healthcare data
  • Store billing details securely
  • Redact function logs

Video

How it works

Setup

  1. Create and Deploy a new Netlify site

    You can use an this repo

  2. Add a form to your site

    Include the netlify attribute so Netlify picks up the submissions

    <form name="my-form" method="POST" netlify>
      <p>
        <label>Your Name: <input type="text" name="name" /></label>
      </p>
      <p>
        <label>Your Email: <input type="email" name="email" /></label>
      </p>
      <p>
        <label>SSN: <input type="text" name="ssn" /></label>
      </p>
      <p>
        <label>Message: <textarea name="message"></textarea></label>
      </p>
      <p>
        <button type="submit">Send Info</button>
      </p>
    </form>
  3. After creating your form, add the secure fields

    Add the secure field to your form and data-secure-field to the fields we want redacted.

    <form name="my-form" method="POST" netlify secure>
      <p>
        <label>Your Name: <input type="text" name="name" /></label>
      </p>
      <p>
        <label>Your Email: <input type="email" name="email" /></label>
      </p>
      <p>
        <label>SSN: <input type="text" name="ssn" data-secure-field /></label>
      </p>
      <p>
        <label>Message: <textarea name="message"></textarea></label>
      </p>
      <p>
        <button type="submit">Send Info</button>
      </p>
    </form>
  4. Install the vgs add-on

    Using the netlify-cli add the add-on to your site.

    netlify addons:create vgs
    

    Then auth with vgs

    netlify addons:auths vgs
    
  5. Then tell VGS the path to your secure form

    netlify addons:config vgs --path /
    
  6. Visit your site and submit your form.

     View the form submission in the Netlify UI to verify the form redaction is working.
    
You can’t perform that action at this time.