This repository is a barebones example of how to use Google reCAPTCHA v3 together with React (Client-side Rendering and Server-side Rendering)
Prerequisites
Requires Google reCAPTCHA v3 API key pair:
- Request an API key pair here
- In Domains options, add
localhost
and127.0.0.1
(to allow calls from local machine)
Environment Variables
This example repository requires the following environment variables to work correctly:
RECAPTCHA_SITE_KEY
- Used to call reCAPTCHA API from Client-sideRECAPTCHA_SECRET_KEY
- Used to call reCAPTCHA API from Server-side (must not be exposed to public!)
Commands to run locally
Command | What it does | Default port |
---|---|---|
RECAPTCHA_SECRET_KEY=<recaptcha_secret_key_here> yarn start:backend |
Starts node backend instance | 3005 |
RECAPTCHA_SITE_KEY=<recaptcha_site_key_here> yarn start:csr |
Starts React Client-side rendering instance | 3001 |
RECAPTCHA_SITE_KEY=<recaptcha_site_key_here> yarn start:ssr |
Starts Next.js Server-side rendering instance | 3002 |