PHP で Google reCAPTCHA v3 付きのお問い合わせフォームを作る (1)

はじめに
===

[Google reCAPTCHA v3](https://developers.google.com/recaptcha/docs/v3) を付けたお問い合わせフォームを PHP で作っていきます。
メール送信ライブラリは [Swift Mailer](https://swiftmailer.symfony.com/) を使用します。
reCAPTCHA v3 については [こちら](https://developers.google.com/recaptcha/docs/v3) 。

Google reCAPTCHA v3 とは
---

巷でよく見かける **私はロボットではありません** と書かれたチェックボックスの新しいバージョンです。
ですが、 **チェックを付けたり、写真を選んだりする必要がなくなりました。**
その代わりに、ユーザの行動から 0.0～1.0 のスコアが算出され、 0 に近いほどロボットによる操作の疑いが強く、 1 に近いほど人間による自然な操作の可能性が高いということみたいです。

前提条件
---

- PHP 7.3 (これより低くても可)
- [Composer](https://getcomposer.org/) をインストールしておく

事前準備
===

reCAPTCHA v3 のキーを取得する
---

まず、 [こちら](https://www.google.com/recaptcha/intro/v3.html) から reCAPTCHA v3 の Admin console にアクセスします。
はじめて Admin console を開いた場合、「新しいサイトを登録する」という画面がされるので、ラベル・reCAPTCHA タイプ(reCAPTCHA v3)・ドメインを入力します。
ラベルは任意の名前で構いません。ドメインは使用するサイトのドメイン、またはローカル開発環境であれば `localhost` 等を入力してください。
最後に「reCAPTCHA 利用条件に同意する」にチェックを入れて「送信」を押します。
サイトキー と シークレット キー が表示されたらコピーしておきます。

Composer で使用するパッケージをインストールする
---

使用するパッケージは以下の2つです。

1. [reCAPTCHA PHP client library (Google 公式)](https://packagist.org/packages/google/recaptcha)
2. [Swift Mailer](https://packagist.org/packages/swiftmailer/swiftmailer)

`composer require` でパッケージをダウンロードします。

```bash
composer require google/recaptcha && composer require swiftmailer/swiftmailer
```

パッケージのダウンロードが終わったらひとまず準備は完了です。
ここから実際にコードを書いていきます。

導入手順
===

1. HTML でフォームを作る
---

まずは HTML でシンプルなお問い合わせフォームを作っていきます。

```html:index.php
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>お問い合わせフォーム</title>
</head>
<body>
  <form action="send.php" method="POST" name="inquiry">
    <p>
      <label for="name">お名前</label>
      <input type="text" name="name" id="name">
    </p>
    <p>
      <label for="email">メールアドレス</label>
      <input type="email" name="email">
    </p>
    <p>
      <label for="contents">お問い合わせ内容</label>
      <textarea name="contents" id="contents" cols="30" rows="10"></textarea>
    </p>
    <button type="submit">送信する</button>
  </form>
</body>
</html>
```

2. reCAPTCHA トークンの生成
---

ここで事前準備の際に取得した **サイトキー** が必要になります。
JavaScript でトークンの生成とトークンをフォームに hidden で配置するコードを `</body>` の直前に書いていきます。
**<サイトキー>** のところは取得したサイトキーを入れてください。
`{action: 'inquiry'}` の `inquiry` は任意のもので構いません。

```html:index.php
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>お問い合わせフォーム</title>
</head>
<body>
  <form action="send.php" method="POST" name="inquiry">
    <p>
      <label for="name">お名前</label>
      <input type="text" name="name" id="name">
    </p>
    <p>
      <label for="email">メールアドレス</label>
      <input type="email" name="email">
    </p>
    <p>
      <label for="contents">お問い合わせ内容</label>
      <textarea name="contents" id="contents" cols="30" rows="10"></textarea>
    </p>
    <button type="submit">送信する</button>
  </form>

  <script src="https://www.google.com/recaptcha/api.js?render=<サイトキー>"></script>
  <script>
    grecaptcha.ready(function() {
      grecaptcha.execute('<サイトキー>', {action: 'inquiry'}).then(function(token) {
        var rcpt = document.createElement('input');
        rcpt.type = 'hidden';
        rcpt.name = 'token';
        rcpt.value = token;
        document.inquiry.appendChild(rcpt);
      });
    });
  </script>
</body>
</html>
```

3. reCAPTCHA v3 のスコアを算出して処理を分岐する
---

フォームからの POST を受け取って、PHPで処理していきます。
ここで事前準備で取得した **シークレット キー** を `<シークレット キー>` に入れます。
`setExpectedAction('inquiry')` の `inquiry` は、先ほどトークン犯行の際に指定した `{action: 'inquiry'}` と同じ名前にします。

**ここからが一番重要です。 `setScoreThreshold(0.5)` の `0.5` は、人間とロボットを分ける閾値です。
ここの数値が 1 に近いほど厳しい判定になり、 0 に近いほど緩い判定になります。**


```php:send.php
<?php
require_once __DIR__ . '/vendor/autoload.php';
use ReCaptcha\ReCaptcha as ReCaptcha;

if ($_POST['token']) {
  $response = (new ReCaptcha('<シークレット キー>'))
                  ->setExpectedHostname($_SERVER['SERVER_NAME'])
                  ->setExpectedAction('inquiry')
                  ->setScoreThreshold(0.5)
                  ->verify($_POST['token'], $_SERVER['REMOTE_ADDR']);
  $result = $response->toArray();

  if ($result['success']) {
    echo 'あなたはロボットではありません。';
  } else {
    echo 'あなたはロボットです。';
  }
}
```

ここまでが reCAPTCHA v3 の基本的な使い方です。

続き → [PHP で Google reCAPTCHA v3 付きのお問い合わせフォームを作る (2)](https://qiita.com/syuus/items/081828bd6f225db5d0c0)