[reCAPTCHA] 問い合わせフォームをセキュアにする – ソフトウェアエンジニアの技術ブログ：Software engineer tech blog

よくある「ボットではありません」というフォーム。
これを実装したい。

https://www.google.com/recaptcha/admin/create

すると、サイトキーとシークレットキーが生成される。

### HTML側の表示
– g-recaptcha タグ（g-recaptcha クラスを指定した要素）を使って自動的に表示

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>reCAPTCHA widget</title>
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css">
    <script>
    	var myAlert = function(response){
    		alert("checkbox is checked");
    	};
    </script>
</head>
<body>
	<div class="container">
		<form method="post" action="#">
			<div class="g-recaptcha" data-sitekey="***" data-callback="myAlert"></div>
		</form>
		<script src="https://www.google.com/recaptcha/api.js" async defer></script>
	</div>
	<script>
	</script>
</body>
</html>

dev環境ではなく、ドメイン上で実装します。

ほう、割とすぐ実装できる。