Works

t430.com - Contact Form

430

Nutx.jsで作成したサイトに設置したコンタクトフォーム。

BOT対策にユーザーへの負担がないreCAPTCHA v3を導入しました。

そのなかで、仮にBOTではないユーザーが設定したスコアより低くBOT判定されたなど、送信ができなかった場合の処理を工夫しました。

なんらかの理由で送信が失敗した際に再度入力を試みてもらうのもストレスになると思うので、そのん場合はユーザーのlocalStorageに入力したデータを保存する仕組みを導入し、更新時・再訪問時に自動的に入力されているようにしました。

その後同じブラウザで送信が成功した場合localStorageのデータは削除されます。

こちらのサイト t430.comのその他のポイントは こちらでご紹介しています。

https://t430.com/contact

Nuxt.js reCAPTCHA PHP Design