# 腾讯云验证码（CAPTCHA）插件

# 1. 插件介绍

标题	名称
中文名称	腾讯云验证码插件
英文名称	tencentcloud-plugin-captcha
最新版本	v1.0.0 (2020.07.15)
适用平台	DCloud uni-app (opens new window)
适用产品	腾讯云验证码 (opens new window)
GitHub 项目	tencentcloud-uniapp-plugin-captcha (opens new window)
gitee 项目	tencentcloud-uniapp-plugin-captcha (opens new window)
Demo项目	tencentcloud-uniapp-plugin-example (opens new window)
主创团队	腾讯云中小企业产品中心（SMB Product Center of Tencent Cloud）
兼容平台	H5

一款帮助开发者在 uni-app 项目开发中快捷使用腾讯云验证码产品功能的插件。

# 2. 功能特性

完成验证码唤醒和结果校验功能

# 3. 安装指引

本插件需要调用 uniCloud 云函数，而使用云函数的前提是：

使用 DCloud 官方开发工具 HBuilderX 2.7+；
已注册 DCloud 开发者账号并通过实名认证；
开通了 uniCloud 并创建一个腾讯云的服务空间；

# 3.1. 新建或打开已有项目

打开 HBuilderX 开发工具；
新建或打开一个 uni-app 项目；

# 3.2. 导入云函数

访问 DCloud 插件市场的腾讯云插件 - 云函数模板 (opens new window) 详情页；
点击详情页右上角 使用 HBuilderX 导入插件，将云函数模板导入到您的项目中；
在项目中打开 cloudfunctions/tencentcloud-plugin/config.js 文件，将腾讯云的密钥信息配置进去，可以在腾讯云 API 密钥管理 (opens new window) 中获取 SecretId、SecretKey 和 APPID；
在uniCloud控制台 (opens new window)注册HBuild账号并登录，创建云服务空间 (opens new window)；
绑定云函数的云服务空间，将云函数 (opens new window) 上传部署 (opens new window) 到您的云服务空间 (opens new window)；

如果您之前在使用其它腾讯云产品的 uni-app 插件时已经导入过此云函数模板，则前 4 个步骤可以省略。

若导入失败或有其它疑问，请查看 uniCloud 帮助文档 (opens new window) 云函数相关章节。

# 3.3. 导入插件

访问 DCloud 插件市场腾讯云验证码（CAPTCHA）插件 (opens new window) 详情页；
点击详情页右上角 使用 HBuilderX 导入插件 ，将插件导入到您的项目中；
在项目中通过 import 语法将插件提供的方法导入到相关业务组件并使用；

本插件的默认导入位置是在您项目的“js_sdk”目录下

# 4. 使用指引

# 4.1. 插件 API 导图

# 4.2. 插件 API 列表

API 名称	API 对应方法名
创建验证码实例	captchaCreater
核查验证码票据结果	describeCaptchaResult

# 4.3. 插件使用示例

// 验证码插件示例
import {
  captchaCreater,
  describeCaptchaResult,
} from "@/js_sdk/tencentcloud-plugin-captcha";

export default {
  methods: {
    // 触发验证码
    showCaptcha: async function() {
      try {
        uni.showLoading({
          mask: true,
        });
        // 创建验证码实例
        const captcha = await captchaCreater((res) => {
          this.result = res;
        });
        // 显示验证码
        captcha.show();
      } catch (error) {
        throw new Error(error);
      } finally {
        uni.hideLoading();
      }
    },
    // 校验验证码是否成功
    checkCaptcha: async function() {
      try {
        uni.showLoading({
          mask: true,
        });
        // 进行验证码校验
        const captcha = await describeCaptchaResult({
          captchaType: 9,
          ticket: this.result.ticket,
          randstr: this.result.randstr,
        });
        // 得到验证码校验结果
        this.checkResult = captcha.result;
      } catch (error) {
        throw new Error(error);
      } finally {
        uni.hideLoading();
      }
    },
  },
};

# 4.4. 名词解释

服务空间：一个服务空间对应一整套独立的云开发资源，包括数据库、存储空间、云函数等资源。服务空间之间彼此隔离。更多详情请访问 uniCloud 开发文档 (opens new window)

云函数：云函数是运行在云端的 JavaScript 代码，更多详情请见 uniCloud 云函数文档 (opens new window)

# 5. 获取入口

插件入口	链接
DCloud 插件市场	腾讯云验证码（CAPTCHA）插件 (opens new window)

# 6. FAQ

Q:有没有demo示例？

A：请查看demo示例tencentcloud-uniapp-plugin-example (opens new window)

Q:验证码插件支持APP端吗？

A：验证码插件只支持H5端，小程序端和APP端请参考客户端SDK文档 (opens new window)

# 7. GitHub 版本迭代记录

# 7.1. tencentcloud-uniapp-plugin-captcha v1.0.0

完成验证码唤醒和结果校验功能

# 8. 联系我们

如果您是用户，欢迎加入我们的官方交流社区 (opens new window)，反馈

bug和故障，获取帮助。
新的插件功能需求。
新的开源应用插件适配需求。

如果您是开发者，欢迎参与我们插件开源项目 (opens new window)，和我们一起修复插件问题，为更多开源应用适配腾讯云插件。

← 腾讯云语音识别（ASR）插件腾讯云对象存储（COS）插件 →