jaxbot/form.html

## form.html
<!doctype html>
<html>
<head>
<script src='https://www.google.com/recaptcha/api.js'></script>
<script>
function registerAPI(form) {
	var params = {
		username: form.username.value,
		password: form.password.value,
		email: form.email.value,
		recaptcha: document.getElementById("g-recaptcha-response").value
	};

	var xhr = new XMLHttpRequest();
	xhr.open("POST", "/register");
	xhr.onload = function() {
		var json = JSON.parse(xhr.responseText);
		console.log(json);
		if (json.registeredSuccessfully) {
			showSuccess();
		} else {
			showError(json.reason);
		}
	}
	xhr.setRequestHeader("Content-type", "application/json");
	xhr.send(JSON.stringify(params));
}

function showSuccess() {
	document.getElementById("form").style.display = "none";
	document.getElementById("success").style.display = "block";
}

function showError(err) {
	document.getElementById("error").innerHTML = err;
}
</script>
</head>
<body>
<h1>Register for test site</h1>

<form action="register" method="post" onsubmit="registerAPI(this);return false;" id="form">
	<span id="error"></span><br>
	<input type="text" name="username" placeholder="Username"><br>
	<input type="text" name="email" placeholder="Email"><br>
	<input type="password" name="password" placeholder="Password"><br>
	<div class="g-recaptcha" data-sitekey="sitekey here"></div>
	<input type="submit" value="Register">
</form>

<div id="success" style="display:none">
	Successfully registered, yay.
</div>

</body>
</html>

## index.js
var express = require('express');
var bodyParser = require('body-parser');
var engines = require('consolidate');
var app = express();

var https = require('https');

app.use(bodyParser.json());
app.engine('html', engines.hogan);

app.get('/', function(req, res) {
        res.render('form.html');
});

app.post('/register', function(req, res) {
        verifyRecaptcha(req.body["recaptcha"], function(success) {
                if (success) {
                        res.end(JSON.stringify({ registeredSuccessfully: true }));
                        // TODO: do registration using params in req.body
                } else {
                        res.end(JSON.stringify({ registeredSuccessfully: false, reason: "Captcha failed, try again." }));
                        // TODO: take them back to the previous page
                        // and for the love of everyone, restore their inputs
                }
        });
});

app.listen(3000);

var SECRET = "secret from webpage here";

// Helper function to make API call to recatpcha and check response
function verifyRecaptcha(key, callback) {
        https.get("https://www.google.com/recaptcha/api/siteverify?secret=" + SECRET + "&response=" + key, function(res) {
                var data = "";
                res.on('data', function (chunk) {
                        data += chunk.toString();
                });
                res.on('end', function() {
                        try {
                                var parsedData = JSON.parse(data);
                                console.log(parsedData);
                                callback(parsedData.success);
                        } catch (e) {
                                callback(false);
                        }
                });
        });
}

## package.json
{
  "name": "nodejs-recaptcha",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "consolidate": "^0.10.0",
    "express": "^4.10.4",
    "hogan.js": "^3.0.2"
  }
}
	<!doctype html>
	<html>
	<head>
	<script src='https://www.google.com/recaptcha/api.js'></script>
	<script>
	function registerAPI(form) {
	var params = {
	username: form.username.value,
	password: form.password.value,
	email: form.email.value,
	recaptcha: document.getElementById("g-recaptcha-response").value
	};

	var xhr = new XMLHttpRequest();
	xhr.open("POST", "/register");
	xhr.onload = function() {
	var json = JSON.parse(xhr.responseText);
	console.log(json);
	if (json.registeredSuccessfully) {
	showSuccess();
	} else {
	showError(json.reason);
	}
	}
	xhr.setRequestHeader("Content-type", "application/json");
	xhr.send(JSON.stringify(params));
	}

	function showSuccess() {
	document.getElementById("form").style.display = "none";
	document.getElementById("success").style.display = "block";
	}

	function showError(err) {
	document.getElementById("error").innerHTML = err;
	}
	</script>
	</head>
	<body>
	<h1>Register for test site</h1>

	<form action="register" method="post" onsubmit="registerAPI(this);return false;" id="form">
	<span id="error"></span><br>
	<input type="text" name="username" placeholder="Username"><br>
	<input type="text" name="email" placeholder="Email"><br>
	<input type="password" name="password" placeholder="Password"><br>
	<div class="g-recaptcha" data-sitekey="sitekey here"></div>
	<input type="submit" value="Register">
	</form>

	<div id="success" style="display:none">
	Successfully registered, yay.
	</div>

	</body>
	</html>
	var express = require('express');
	var bodyParser = require('body-parser');
	var engines = require('consolidate');
	var app = express();

	var https = require('https');

	app.use(bodyParser.json());
	app.engine('html', engines.hogan);

	app.get('/', function(req, res) {
	res.render('form.html');
	});

	app.post('/register', function(req, res) {
	verifyRecaptcha(req.body["recaptcha"], function(success) {
	if (success) {
	res.end(JSON.stringify({ registeredSuccessfully: true }));
	// TODO: do registration using params in req.body
	} else {
	res.end(JSON.stringify({ registeredSuccessfully: false, reason: "Captcha failed, try again." }));
	// TODO: take them back to the previous page
	// and for the love of everyone, restore their inputs
	}
	});
	});

	app.listen(3000);

	var SECRET = "secret from webpage here";

	// Helper function to make API call to recatpcha and check response
	function verifyRecaptcha(key, callback) {
	https.get("https://www.google.com/recaptcha/api/siteverify?secret=" + SECRET + "&response=" + key, function(res) {
	var data = "";
	res.on('data', function (chunk) {
	data += chunk.toString();
	});
	res.on('end', function() {
	try {
	var parsedData = JSON.parse(data);
	console.log(parsedData);
	callback(parsedData.success);
	} catch (e) {
	callback(false);
	}
	});
	});
	}
	{
	"name": "nodejs-recaptcha",
	"version": "1.0.0",
	"description": "",
	"main": "index.js",
	"scripts": {
	"test": "echo \"Error: no test specified\" && exit 1"
	},
	"author": "",
	"license": "ISC",
	"dependencies": {
	"consolidate": "^0.10.0",
	"express": "^4.10.4",
	"hogan.js": "^3.0.2"
	}
	}