Friction River Software - CakePHP5入門【CakePHP5応用編⑥】CAPTCHA他

Ｂ美

今回は「CAPTCHAキャプチャ」を組み込もうと思うんだけど、ちょっと難しいのよね
なので、私が主導していきます。

まずは「Captcha Plugin for CakePHP（dereuromark/cakephp-captcha）」をcomposerでインストールしましょう

cd html/bbsapp[Enter]
composer require dereuromark/cakephp-captcha[Enter]

Ａ子

OK、できたよ

Ｂ美

次にプラグインをロードします

bin/cake plugin load Captcha[Enter]

それから、必ずデータベーステーブルを作らないといけないから、以下のコマンドを実行してね

bin/cake migrations migrate -p Captcha[Enter]

あと（念のためにだけど）キャッシュをクリアしておきましょう

bin/cake cache clear_all[Enter]

Ｃ菜

「migrations migrate」とか「cache clear_all」とか、意味は分からないですけど、とりあえず実行してみました～

Ｂ美

まぁ、必要な手順だと思っておけば良いよ（苦笑）

次に、このプラグインをロードするための記述を「bbsapp/config」の中の「plugins.php」というファイル内に記述するんだけど、さっきbakeコマンドを実行したから基本形はすでにできてます

'Captcha' => [],

そこに以下の一文を追記してね

'Captcha' => [
'engine' => 'Default',
],

Ｂ美

次は「bbsapp/src/View」の中にある「AppView.php」の「initialize」メソッドの中に次の一文を追加します

parent::initialize();

$this->loadHelper('Captcha.Captcha');

これでViewビューファイル内でCaptchaヘルパーが利用できるようになるの
（もしも「parent::initialize();」が無かったら追記してね）

Ｃ菜

ということは～

次は「bbsapp/templates/Posts」の中の「add.php」を書き換えるんですね～？

Ｂ美

その通り！
<table>タグ内に下記を追加します

<tr>
<td colspan="2"><?= $this->Captcha->render() ?></td>
</tr>

これにより「投稿」ボタンのすぐ上に「CAPTCHAキャプチャ」画像が埋め込まれるわ

Ａ子

面倒くせぇ…

Ｂ美

何、言ってるのよ
自分で「CAPTCHAキャプチャ」を一から作ることを考えたら、超・楽なんだけど！

さて、一番の問題はControllerコントローラーである「PostsController.php」なのよね

use Cake\ORM\TableRegistry;

を上のほうに記述して、「initialize」メソッド内に以下の一文を追加してね

$this->loadComponent('Captcha.Captcha');

Ｂ美

「add」メソッド内では、データベーステーブルにアクセスして、正解の値（$captcha->result）を取得するの
（隠し属性のデータ…$captcha_id…が送信されてくるから、その値で検索するってわけ）

あとはユーザが入力した値（$captcha_result）と正解の値を照合して、一致していればCAPTCHAキャプチャ認証に成功よ

$captcha_result = $this->request->getData('captcha_result');
$captcha_id = $this->request->getData('captcha_id');
$captchasTable = TableRegistry::getTableLocator()->get('Captcha.Captchas');
$captcha = $captchasTable->find()->where(['id' => $captcha_id])->first();

if ($captcha_result != $captcha->result) {
　　（認証失敗）
} else {
　　（認証成功）
}

分かってしまえば簡単なんだけどさ
ネット上にサンプルコードが存在しないから、ここまで解析するのにすっげぇ苦労したわ（苦笑）

Ｃ菜

Ｂ美部長はこれを独力で見つけ出したんですか～？

すごいですぅ～

Ｂ美

ChatGPTの助けも借りたけどね（苦笑）
（というか、ChatGPTと話し合いながら、協力して正解を見つけた…って感じかな）

というか、ChatGPTの言う通りにコードを打ち込んで、プログラムがまともに動いたことがこれまでほとんど無い…（笑）
（今回、正解パターンをChatGPTが学習したはずだから、今後は大丈夫だと思うけどね）

Ａ子

まだまだAIが人間のプログラマを超える日は来ないってことかー（苦笑）

まぁ、それはともかく、さっそくテストしてみようよ