快速开始

目标： 5 分钟内完成一个可工作的验证码集成

前置准备

在开始之前，请确保：

✅ 已注册 Geelab 账号
✅ 已创建验证场景并获取凭证
✅ 确定您的部署平台（Web、iOS、Android）

还没有账号？ 访问 Geelab 控制台注册并创建您的第一个验证场景。

完整示例

前端集成（5 分钟）

创建一个 HTML 文件，复制以下代码：

index.html

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Geelab 验证码示例</title>
</head>
<body>
  <h1>登录表单</h1>
  <form id="login-form">
    <input type="text" placeholder="用户名" required>
    <input type="password" placeholder="密码" required>

    <!-- 验证码容器 -->
    <div id="captcha"></div>

    <button type="submit">登录</button>
  </form>

  <!-- 引入 Geelab SDK -->
  <script src="https://static.geelabapi.com/v4/gl4.js"></script>

  <script>
    let captchaObj;

    // 1. 初始化验证码
    initGeetest4({
      captchaId: 'YOUR_CAPTCHA_ID',  // 替换为您的 captcha_id
      product: 'bind'  // 嵌入式显示
    }, function(captcha) {
      captchaObj = captcha;
      // 2. 渲染到页面
      captcha.appendTo('#captcha');
    });

    // 3. 表单提交时验证
    document.getElementById('login-form').addEventListener('submit', async function(e) {
      e.preventDefault();

      // 获取验证结果
      const result = captchaObj.getValidate();

      if (!result) {
        alert('请完成验证');
        return;
      }

      // 4. 提交到后端验证
      const response = await fetch('/api/login', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({
          username: document.querySelector('input[type="text"]').value,
          password: document.querySelector('input[type="password"]').value,
          // 验证参数
          lot_number: result.lot_number,
          captcha_output: result.captcha_output,
          pass_token: result.pass_token,
          gen_time: result.gen_time
        })
      });

      const data = await response.json();
      if (data.success) {
        alert('登录成功！');
      } else {
        alert('登录失败：' + data.message);
      }
    });
  </script>
</body>
</html>

重要： 将 YOUR_CAPTCHA_ID 替换为您在控制台获取的实际 ID。

后端验证（Node.js + Express）

server.js

const express = require('express');
const crypto = require('crypto');
const axios = require('axios');

const app = express();
app.use(express.json());

// 配置（从环境变量读取）
const CAPTCHA_ID = process.env.CAPTCHA_ID;
const CAPTCHA_KEY = process.env.CAPTCHA_KEY;
const VERIFY_URL = 'https://cap-global.geelabapi.com/validate';  // 根据您的地域选择

// 登录接口
app.post('/api/login', async (req, res) => {
  const { username, password, lot_number, captcha_output, pass_token, gen_time } = req.body;

  try {
    // 1. 生成签名
    const sign_token = crypto
      .createHmac('sha256', CAPTCHA_KEY)
      .update(lot_number)
      .digest('hex');

    // 2. 调用 Geelab 验证接口
    const response = await axios.post(
      `${VERIFY_URL}?captcha_id=${CAPTCHA_ID}`,
      new URLSearchParams({
        lot_number,
        captcha_output,
        pass_token,
        gen_time,
        sign_token
      }),
      {
        headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
        timeout: 5000
      }
    );

    // 3. 检查验证结果
    if (response.data.result === 'success') {
      // 验证通过，执行登录逻辑
      // TODO: 验证用户名密码
      res.json({ success: true, message: '登录成功' });
    } else {
      // 验证失败
      res.json({ success: false, message: '验证失败，请重试' });
    }

  } catch (error) {
    // 4. 容灾处理：验证服务异常时放行
    console.error('验证服务异常:', error.message);
    // TODO: 记录日志，执行登录逻辑
    res.json({ success: true, message: '登录成功（容灾）' });
  }
});

app.listen(3000, () => {
  console.log('服务器运行在 http://localhost:3000');
});

安全提示：

CAPTCHA_KEY 必须保存在服务端，不要暴露在前端代码中
使用环境变量管理敏感信息
生产环境必须使用 HTTPS

后端验证（Python + Flask）

app.py

from flask import Flask, request, jsonify
import hmac
import hashlib
import requests
import os

app = Flask(__name__)

# 配置（从环境变量读取）
CAPTCHA_ID = os.getenv('CAPTCHA_ID')
CAPTCHA_KEY = os.getenv('CAPTCHA_KEY')
VERIFY_URL = 'https://cap-global.geelabapi.com/validate'  # 根据您的地域选择

@app.route('/api/login', methods=['POST'])
def login():
    data = request.json
    username = data.get('username')
    password = data.get('password')
    lot_number = data.get('lot_number')
    captcha_output = data.get('captcha_output')
    pass_token = data.get('pass_token')
    gen_time = data.get('gen_time')

    try:
        # 1. 生成签名
        sign_token = hmac.new(
            CAPTCHA_KEY.encode(),
            lot_number.encode(),
            hashlib.sha256
        ).hexdigest()

        # 2. 调用 Geelab 验证接口
        response = requests.post(
            f'{VERIFY_URL}?captcha_id={CAPTCHA_ID}',
            data={
                'lot_number': lot_number,
                'captcha_output': captcha_output,
                'pass_token': pass_token,
                'gen_time': gen_time,
                'sign_token': sign_token
            },
            headers={'Content-Type': 'application/x-www-form-urlencoded'},
            timeout=5
        )

        # 3. 检查验证结果
        result = response.json()
        if result.get('result') == 'success':
            # 验证通过，执行登录逻辑
            # TODO: 验证用户名密码
            return jsonify({'success': True, 'message': '登录成功'})
        else:
            # 验证失败
            return jsonify({'success': False, 'message': '验证失败，请重试'})

    except Exception as e:
        # 4. 容灾处理：验证服务异常时放行
        print(f'验证服务异常: {str(e)}')
        # TODO: 记录日志，执行登录逻辑
        return jsonify({'success': True, 'message': '登录成功（容灾）'})

if __name__ == '__main__':
    app.run(debug=True, port=3000)

运行步骤：

# 安装依赖
pip install flask requests

# 设置环境变量
export CAPTCHA_ID="your_captcha_id"
export CAPTCHA_KEY="your_captcha_key"

# 运行服务
python app.py

地域选择

根据您的用户所在地区选择对应的验证服务域名：

地域	适用场景	验证域名
🌏 全球	全球用户或亚太地区	`cap-global.geelabapi.com`
🇪🇺 欧洲	欧盟用户（GDPR 合规）	`cap-eu.geelabapi.com`
🇺🇸 北美	北美用户	`cap-na.geelabapi.com`