文件

接入指南

面向常見 CAPTCHA 流程的元件設定、後端驗證和遷移說明。

快速開始

BotFlush 可透過三個步驟完成接入：載入元件、渲染元件，並在後端驗證 token。

1. 載入元件

將 widget script 加到頁面中。它會非同步載入，不會阻塞渲染。

<script src="https://challenge.botflush.com/widget.js" async defer></script>

2. 加入容器

在希望顯示 CAPTCHA 的位置放置容器元素。

<div id="bf-captcha" data-sitekey="YOUR_SITE_KEY"></div>

3. 後端驗證

使用者完成挑戰後會產生 token。將它傳送到伺服器並透過 API 驗證。

POST https://challenge.botflush.com/api/siteverify
Content-Type: application/json

{
  "secret": "YOUR_SECRET_KEY",
  "token": "TOKEN_FROM_CLIENT"
}

JavaScript API

BotFlush.render()

BotFlush.render('bf-captcha', {
  siteKey: 'YOUR_SITE_KEY',
  callback: function(token) {
    console.log('Verified:', token);
  }
});

BotFlush.reset()

BotFlush.reset();

BotFlush.getResponse()

var token = BotFlush.getResponse();

遷移說明

BotFlush 支援熟悉的 widget 和 siteverify 模式。遷移通常從 script URL、金鑰和驗證端點開始；正式上線前請測試 callback 與錯誤處理。

<!-- Before -->
<script src="https://www.google.com/recaptcha/api.js"></script>
<div class="g-recaptcha" data-sitekey="GOOGLE_KEY"></div>

<!-- After -->
<script src="https://challenge.botflush.com/widget.js"></script>
<div class="g-recaptcha" data-sitekey="BOTFLUSH_KEY"></div>

驗證模式

BotFlush 提供多種挑戰引擎。你可以在控制台中為每個站點設定允許的引擎。

引擎	類型	描述
Invisible Free	背景	無需使用者互動的工作量證明驗證
Visual Match	互動	圖片模式匹配驗證
Emoji Click	互動	從視覺網格中選擇匹配的表情符號
Invisible Max	背景	GPU 加速的工作量證明驗證

後端驗證

Node.js

const res = await fetch('https://challenge.botflush.com/api/siteverify', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify({ secret, token })
});

Python

resp = requests.post('https://challenge.botflush.com/api/siteverify', json={
    'secret': BOTFLUSH_SECRET,
    'token': token
})

Go

resp, _ := http.Post("https://challenge.botflush.com/api/siteverify",
    "application/json", bytes.NewBuffer(payload))

下載

Node Inspector — Chrome 擴充功能

安裝: 下載並解壓縮後，開啟 Chrome 擴充功能頁面，啟用開發人員模式，並載入解壓縮後的資料夾。

下載 Node Inspector (.zip)