reCAPTCHA v3をWordpressサイトに導入

イメージ
reCAPTCHA v3とは
reCAPTCHAは不正なアクセスをするbotプログラムなどからサイトを防御するために利用されている仕掛けです。
v2などでは、この機能を利用して、画像認識に役立てていました。

v3になって、人間の反応など不要で、AIを利用してサイトの悪用を防止するシステムに変わりました。
PCで閲覧した場合、右下に下のような画像が表示されるようになりました。


しかも、v2まではフォームやログイン画面などへのアクセスだけに設置して防いでいたのですが、全てのページに対して設置できるようです。

reCAPTCHA v3をWordpressのサイトに導入 今回、Wordpressのプラグインを利用して、reCAPTCHA v3をWordpressサイトに導入しました。
手順は超簡単 まず、下記のページからサイトを登録して、キーを取得します。 https://www.google.com/recaptcha/admin/create
適当にラベルを入力して、v3を選択。
ドメインを入力して、利用条件に同意した後に送信ボタンでキーは取得できます。

Wordpressのプラグインは https://ja.wordpress.org/plugins/advanced-nocaptcha-recaptcha/
これを利用しました。

導入して、v3を選んで、上で取得したキーを入力するだけです。

どこで検証するか?という部分に関しては
こんな感じでチェックを入れました。

他はデフォルトのままです。

簡単でした。

導入後は管理画面で状況閲覧が可能です。
問題点 tokenを発行して処理されているんですが、5分程度の時間しか無いようです。 ということは、入力に時間がかかる場合はtimeoutの危険が増します。
管理画面上で、有効時間を延ばす術は無い模様。

viewportの設定を学ぶ

 基本、レスポンシブデザインで制作する時は、viewport設定はシンプルな設定で大丈夫。
 Google Developersによると、推奨される設定方法は

<meta name=viewport content="width=device-width, initial-scale=1">
これで、端末幅に応じて設定される。

 弊社でレスポンシブデザインで制作した「タカハラ整形外科クリニック」。

 問題はPCサイトとスマホサイトを作り分ける際の設定。
 最近はウェブマスターツールで「viewportが設定されていません」と怒られるので、viewportを設定したほうが良いみたい。
 ただし、大手のいくつかのサイトを見て回ったけども、パソコンサイトの場合はviewportの設定がされていないところが多かった。

 スマホサイトの場合、先に書いた設定で問題なく動作するように作るほうがいい。
 スマホの場合、縦・横で見た時の横幅のサイズが変わるから、柔軟に動く形が望ましい。
 PC向けの場合、そこにはiPadなどのタブレット型の端末で見た際にも正常表示されるのが望ましい訳で、下記のような記述がいいのではないかと考えてる。

<meta name=viewport content="width=1000, initial-scale=1">

 赤字にした部分を臨機応変に変更したらいいのでは?というのが昨日の結論。

コメント

このブログの人気の投稿

UTM(統合脅威管理)って邪魔で不要

AWSのS3をLinuxでマウントして、更にWindowsで利用

巡回頻度を上げるぞ