UNPKG

adonis-recaptcha2

Version:
134 lines (103 loc) 2.91 kB
# Adonis ReCAPTCHA v2 Version [for **Adonis v4**](https://github.com/lookinlab/adonis-recaptcha2/tree/v1) [![Build Status](https://travis-ci.org/lookinlab/adonis-recaptcha2.svg?branch=master)](https://travis-ci.org/lookinlab/adonis-recaptcha2) [![Coverage Status](https://coveralls.io/repos/github/lookinlab/adonis-recaptcha2/badge.svg?branch=master)](https://coveralls.io/github/lookinlab/adonis-recaptcha2?branch=master) Verifier for Google ReCAPTCHA v2. Not working with ReCAPTCHA Enterprise or v3 ## Installation Make sure to install it using `npm` or `yarn`. ```bash # npm npm i adonis-recaptcha2 node ace configure adonis-recaptcha2 # yarn yarn add adonis-recaptcha2 node ace configure adonis-recaptcha2 ``` ## How to use ### Step 1: Get secret and site keys You need to receive your `siteKey` and `secretKey` for your domain from [Google reCAPTCHA v3 Admin Console](https://www.google.com/recaptcha/admin) Login and Follow the steps on this page to include the reCAPTCHA on your website. ### Step 2: Initialization - Make sure to register the provider inside `.adonisrc.json` file. ```json { "providers": [ "...other packages", "adonis-recaptcha2" ] } ``` - Add variables to `.env` file of project. ```txt ... RECAPTCHA_SITE_KEY=YOUR_KEY RECAPTCHA_SECRET_KEY=YOUR_KEY ``` - Add fields to `env.ts` file of project. ```ts import Env from '@ioc:Adonis/Core/Env' export default Env.rules({ // ... RECAPTCHA_SITE_KEY: Env.schema.string(), RECAPTCHA_SECRET_KEY: Env.schema.string(), }) ``` - Set options in `config/recaptcha.ts`. ```ts import Env from '@ioc:Adonis/Core/Env' import { RecaptchaConfig } from '@ioc:Adonis/Addons/Recaptcha2' const recaptchaConfig: RecaptchaConfig = { // ... siteKey: Env.get('RECAPTCHA_SITE_KEY'), // ... secretKey: Env.get('RECAPTCHA_SECRET_KEY'), } export default recaptchaConfig ``` ### Step 3: Add named middleware to `start/kernel.ts` ```ts Server.middleware.registerNamed({ recaptcha: () => import('App/Middleware/Recaptcha') }) ``` ### Step 4: Add middleware for `start/routes.ts` Example: ```ts Route.post('login', 'AuthController.login').middleware('recaptcha') ``` This middleware will check `g-recaptcha-response` field in body request ```json { "login": "admin", "password": "admin", "g-recaptcha-response": "osjoiadjaoisdjasijda..." } ``` > Field `g-recaptcha-response` it is Google reCAPTCHA v2 response ## Use in Views > **Note:** Required [View](https://docs.adonisjs.com/guides/views/introduction) (@adonisjs/view) ### Step 1: Enable `views` in `config/recaptcha.ts` ```ts const recaptchaConfig: RecaptchaConfig = { // ... views: true } ``` ### Step 2: Use `recaptcha()` function in templates ```html ... <head> ... {{ recaptcha('script') }} </head> <body> <section> ... <form action="/login"> ... {{ recaptcha('form') }} </form> </section> </body> </html> ```