---
type: how-to
title: Migrasi dari reCAPTCHA
summary: "Tukar reCAPTCHA dengan Caputchin dengan perubahan minimal: bentuk dua-bagian yang sama (widget klien plus verify sisi-server) memetakan hampir satu-lawan-satu, inilah sebelum-dan-sesudah persis untuk tiap potongan."
---

Caputchin memakai model dua-bagian yang sama dengan reCAPTCHA, sebuah widget di halaman yang menghasilkan token, dan pemeriksaan sisi-server yang memastikannya, jadi migrasi sebagian besar adalah tukar mekanis, bukan penulisan-ulang. Pertukaran server khususnya mencerminkan bentuk `siteverify` reCAPTCHA dengan sengaja. Panduan ini memberi sebelum-dan-sesudah untuk tiap potongan.

Jika kamu belum membuat akun Caputchin dan kunci situs, lakukan [buat akunmu](/docs/getting-started/create-your-account) dulu; kamu akan butuh **public key** (`cpt_pub_...`) untuk halaman dan **secret** (`cpt_sec_...`) untuk backend-mu, pemisahan yang sama dengan site key dan secret key reCAPTCHA.

## Model mental tak berubah

```mermaid
flowchart LR
  A["Widget di halamanmu"] -->|token| B["Formulir / permintaanmu"]
  B -->|token| C["Backend-mu"]
  C -->|secret + token| D["Endpoint siteverify"]
  D -->|success?| C
```

Semua yang sudah kamu bangun di sekitar reCAPTCHA, render widget, kumpulkan token, POST ke servermu, verifikasi sebelum memercayai permintaan, tetap. Hanya nama dan endpoint yang berubah.

## 1. Tukar cuplikan klien

| | reCAPTCHA (v2 checkbox) | Caputchin |
|---|---|---|
| Skrip | `<script src="https://www.google.com/recaptcha/api.js" async defer>` | `<script src="https://cdn.jsdelivr.net/npm/@caputchin/widget@3/dist/widget.js">` |
| Elemen | `<div class="g-recaptcha" data-sitekey="...">` | `<caputchin-widget sitekey="cpt_pub_...">` |
| Field token di formulir | `g-recaptcha-response` (disuntik-otomatis) | `caputchin-token` (disuntik-otomatis) |
| Membaca token di JS | `grecaptcha.getResponse()` | `detail.token` [event `pass`](/docs/references/widget-methods-and-events) |

Seperti reCAPTCHA, widget Caputchin **menyuntik-otomatis sebuah field token tersembunyi** ke formulir tempat ia berada, jadi jika formulirmu sudah melakukan POST biasa, kamu hanya mengubah elemen dan nama field yang dibaca backend-mu. Lihat [tambahkan widget](/docs/getting-started/add-the-widget) untuk penyiapan klien lengkap dan [pilihan CDN vs npm](/docs/integration-guides/cdn).

## 2. Tukar verify server

Di sinilah keduanya paling dekat, bentuk permintaan dan respons sejajar hampir field demi field.

| | reCAPTCHA | Caputchin |
|---|---|---|
| Endpoint | `POST https://www.google.com/recaptcha/api/siteverify` | `POST https://verify.caputchin.com/v1/siteverify` |
| Field permintaan | `secret`, `response` | `secret`, `response` (identik) |
| Respons | `{ success, challenge_ts, hostname, "error-codes" }` | `{ success, challenge_ts, hostname, error-codes, score? }` |
| Aturan kepercayaan | bertindak hanya jika `success === true` | bertindak hanya jika `success === true` (identik) |

Di kebanyakan stack satu-satunya perubahan pada kode verifikasimu adalah URL dan nilai secret. Referensi permintaan/respons penuh, termasuk kode galat, ada di [verifikasi token di backend-mu](/docs/integration-guides/verify-on-your-backend); cuplikan framework ada di [contoh backend](/docs/integration-guides/backend-examples).

## 3. Petakan skor, jika kamu memakai reCAPTCHA v3

reCAPTCHA v3 mengembalikan sebuah `score` (0.0 sampai 1.0) dan memintamu memilih ambang, kamu menebak seberapa manusia sebuah permintaan tampak. Caputchin **tak** bekerja seperti itu: `success` adalah lolos/gagal otoritatif, karena verifikasi sebenarnya dituntaskan (pemeriksaan proof-of-work, atau [ronde game yang diturunkan-ulang di server](/docs/understanding-caputchin/gaming-anti-cheat)), bukan probabilitas.

Jika kodemu punya `if (data.score >= 0.5)`, ganti dengan `if (data.success)`. Bidang `score` Caputchin ada hanya untuk ronde game dan adalah skor **game** (informasional, untuk papan-peringkatmu sendiri), tak pernah kemungkinan-bot, jadi jangan menggerbang akses padanya.

## Apa yang jadi lebih baik dalam perpindahan

- **Tanpa pengumpulan data pengunjung.** reCAPTCHA memprofilkan pengunjungmu; Caputchin tak mengumpulkan IP, User-Agent, sidik jari, atau telemetri perilaku, protokol tak punya tempat untuk menaruh pengenal pengunjung. Lihat [filosofi](/docs/understanding-caputchin/philosophy).
- **Satu widget, bukan v2-vs-v3.** Tak ada produk tak-kasatmata/skor terpisah untuk dipilih; satu elemen mencakup checkbox dan game opsional.
- **Game opsional.** Alih-alih kisi-lampu-lalu-lintas, kamu bisa mengubah verifikasi menjadi game pendek yang sungguh dimainkan pengunjungmu. Lihat [tambahkan game](/docs/getting-started/add-a-game).
- **CSP ketat tetap ketat.** Caputchin berjalan di bawah Content-Security-Policy yang rapat; kamu mengizinkan beberapa origin ketimbang melonggarkan kebijakanmu. Lihat [bagaimana Caputchin men-sandbox game](/docs/understanding-caputchin/game-sandboxing#the-csp-you-set-on-your-own-page).

## Hal yang sering terlewat

- **Dua key, dua rumah.** Public key (`cpt_pub_...`) masuk ke halaman; secret (`cpt_sec_...`) tetap hanya di sisi-server, persis disiplin reCAPTCHA. Jangan kirim secret ke peramban.
- **Token sekali-pakai.** Seperti reCAPTCHA, sebuah token terverifikasi sekali. Jangan cache atau putar-ulang ia.
- **Ubah nama field yang dibaca backend-mu.** Field tersembunyinya `caputchin-token`, bukan `g-recaptcha-response`, kelewatan satu-baris yang umum.

## Lihat juga

- [Tambahkan widget](/docs/getting-started/add-the-widget): penyiapan klien lengkap.
- [Verifikasi token di backend-mu](/docs/integration-guides/verify-on-your-backend): referensi `siteverify` otoritatif.
- [Contoh backend](/docs/integration-guides/backend-examples): panggilan verify di tiap bahasa.
- [Tambahkan game](/docs/getting-started/add-a-game): ubah verifikasi menjadi game.