if-captcha

如何使用

npm install if-captcha

For Vue 3

//main.js
import IfCaptcha from 'if-captcha'
app.use(IfCaptcha)

setup中使用

import {useCaptcha} from 'if-captcha'

setup(){
    let $ = useCaptcha();
    const captcha = async () => {
        let res = await $.verify({
            captchaGetUrl: '/captcha/get',
            captchaCheckUrl: '/captcha/check',
            });
        if(res) {
            alert('验证成功')
        } else {
            alert('验证失败')
        }
    }

    return {
        captcha
    };
}

For Vue 2

//main.js
import IfCaptcha from 'if-captcha'

Vue.use(IfCaptcha)

async captcha(){
    let res = await this.$ifCaptcha.verify({
        captchaGetUrl: '/captcha/get',
        captchaCheckUrl: '/captcha/check',
        });
    if(res) {
        alert('验证成功')
    } else {
        alert('验证失败')
    }
}

$.verify(Options）

param	type	default	desc
captchaType	String: 'blockPuzzle' | 'clickWord'	'blockPuzzle'	模块类型
captchaGetUrl	String	'/captcha/get'	获取图片内容
captchaCheckUrl	String	'/captcha/check'	检查验证结果
params	Object	{}	检查结果额外的传参

返回 {captchaVerification}

Todo

captchaGetUrl 支持 Promise对象

captchaGetUrl: async function({ captchaType }){
    return {
       originalImageBase64, //验证码背景 base64
       jigsawImageBase64,  //验证滑块的背景 base64
       token,  // 后端返回的唯一toke
       secretKey  // 端返回的ASE加密key
    }
}

captchaCheckUrl 支持 Promise对象

captchaCheckUrl: async function(payload){
    // const { captchaType, pointJson, token, params } = payload  // 插件返回的关键数据，你可以扩充该数据
    return {
       repCode  // 成功则返回 repCode:"0000"
    }
}