README

Generate SVG captcha in NodeJS Express applications

useful if you

cannot or do not want to use google recaptcha
have issue with install c++ addon
have issue with install canvas dependency

install

npm install --save svg-captcha-express

usage

'use strict'

const express = require('express')
const session = require('express-session')
const bodyParser = require('body-parser')

const captchaUrl = '/captcha.jpg'
const captchaSessionId = 'captcha'
const captchaFieldName = 'captcha'

const captcha = require('svg-captcha-express').create({ 
    cookie: captchaSessionId
})

//load custom font (optional)   
captcha.loadFont(path.join(__dirname, '../fonts/airstrike.ttf'))

const app = express()
app.use(session({
    secret: 'your secret',
    resave: false,
    saveUninitialized: true,
}))
app.use(bodyParser.urlencoded({ extended: false }))

app.get(captchaUrl, captcha.image())

app.get('/', (req, res) => {
    res.type('html')
    res.end(`
        <img src="${ captchaUrl }"/>
        <form action="/login" method="post">
            <input type="text" name="${ captchaFieldName }"/>
            <input type="submit"/>
        </form>
        <a href='/'>refresh</a>
    `)
})

app.post('/login', (req, res) => {
    res.type('html')
    res.end(`
        <p>CAPTCHA VALID: ${ captcha.check(req, req.body[captchaFieldName]) }</p>
    `)
})

API

`svgCaptchaExpress.create(options)`

cookie: 'captcha',
background: 'rgb(255,200,150)',
fontSize: 60,
width: 250,
height: 150,
charPreset: 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789',
size: 5,
noise: 1
size: 4 // size of random string
color: false // will generate random color for each character

`svgCaptcha.image()`

Will return an SVG captcha response result

`svgCaptcha.check(req, text, caseSensitive)`

req: express request
text: Captcha input data
caseSensitive: default true

`svgCaptcha.loadFont(url)`

Load your own font and override the default font.

url: string // path to your font This api is a wrapper around loadFont api of opentype.js.
Your may need experiment around various options to make your own font accessible.
See the following api.

sample image

default captcha image:

why use svg?

It does not require any c++ addon.
The result image is smaller than jpeg image.

This has to be a joke. /<text.+>;.+</text>/g.test...

svg captcha uses opentype.js underneath, which means that there is no '<text>1234</text>'.
You get '<path fill="#444" d="M104.83 19.74L107.85 19.74L112 33.56L116.13 19.74L119.15 19.74L113.48 36.85...'
instead.

Even though you can write a program that convert svg to png, svg captcha has done its job
—— make captcha recognition harder

Issues

Please add issues if you have a question or found a problem. Pull requests are welcome too!

To-dos

Math Expressions

License

MIT

svg-captcha-express-black-lines

Usage no npm install needed!