Sample implementation for captchas.net
npm install @solarwinter/captchajs
CaptchaJs is a JavaScript library with the aim of making it easy to
use the captchas.net service.
```
yarn add @solarwinter/captchajs
or
``
npm install @solarwinter/captchajs
For testing and development you can use the example values seen on the bottom of the
captchas.net webpage:
* username demosecret
* secret key RandomZufall
* random string
Load the username and secret key into your program - the common method is via .env file - and use
them to initialise CaptchaJs.
`typescript
import { CaptchaJs } from "@solarwinter/captchajs";
const captcha = new CaptchaJs({ client: process.env.CAPTCHAS_CLIENT,
secret: process.env.CAPTCHAS_SECRET });
const random = captcha.getRandomString();
const imageUrl = captcha.getImageUrl({ randomString: random })
const audioUrl = captcha.getAudioUrl({ randomString: random })
`
Those URLs need to be passed to the page shown to the user. The exact method of doing so will vary; if you're using
ERB (similar to Jinja or Mustache) then it might look like this:
`html
When the user hits Submit on the form, the fields should be POSTed back to your server application. There you can check
the captcha string - for example:
`typescript
if (!captcha.validateRandomString(data.randomString)) {
console.log(Error validating random string ${data.randomString}); // At this point you can re-render the contact page, for example with error text:
// "That captcha has expired or already been used"
} else if (!captcha.verifyPassword(data.randomString, data.captchaPassword)) {
console.log(
Error verifying password ${data.captchaPassword}); // At this point you can re-render the contact page, for example with error text:
// "Sorry, you got the captcha text wrong. Please try again."
} else {
console.log("Captcha passed!");
// Do something here!
}
``Before you can use this package in production you need to register with the
captchas.net service. When you've registered you should receive an email from
captchas.net
containing your client ID (or 'user name') and the shared secret.