VUE接入 腾讯验证码,极验验证码

VUE接入 腾讯验证码,极验验证码

安装

$ npm install vue-social-captcha -S

使用

在 main.js 文件中引入插件并注册

# main.js
import captcha from 'vue-social-captcha'
Vue.use(captcha)

在项目中使用 vue-social-captcha

props属性

通过以下属性来设置你的验证码

服务端Url请求与响应

数据请求
url请求时会附带以下两个参数到服务端，以便于业务逻辑开发。

{
    g_type: 'TencentCaptcha', // 验证码类型
    g_scene: 'Login', // 验证码使用场景
}

数据响应返回格式
服务端返回参数主要有三个，分别是code msg data。

例：

// 极验验证
{
    "code":1,
    "msg":"验证成功",
    "data":
    {
        "success":1,
        "gt":"29e4e065c7ba05ff77ba896e5d577f89",
        "challenge":"bd26076b3afe9ed3c17738f3f8a7eec7",
        "new_captcha":1
    }
}
// 腾讯验证
{
    "code":1,
    "msg":"验证成功"
}

相关资源

腾讯验证

极验验证

github:https://github.com/QQOQ/vue-social-captcha