Buat akun dan kunci situs pertamamu

Ini pelajaran pertama dari tiga pelajaran singkat. Bersama-sama, ketiganya membawamu dari akun kosong ke sebuah tantangan game sungguhan yang menjaga formulir live.

Kamu bekerja di BananaSeed, dan formulir kontak di situsmu tenggelam dalam spam: bot dan agen AI berskrip menembakkan kiriman sampah ke sana sepanjang waktu. Kamu ingin Caputchin berdiri di depan formulir itu agar hanya manusia sungguhan yang lolos.

Beginilah cara Caputchin melakukannya. Saat seseorang membuka formulir kontakmu, Caputchin memberinya tantangan singkat di peramban (sebuah checkbox sederhana, atau game pendek). Menuntaskannya menghasilkan token sekali pakai, yang dikirim halaman bersama kiriman. Servermu lalu memeriksa token itu dengan Caputchin sebelum memercayai permintaannya. Sebuah bot yang langsung POST ke endpoint-mu tak pernah menuntaskan tantangan, jadi ia tak punya token yang valid, dan servermu menolaknya.

Situs BananaSeed adalah frontend React dengan backend Node.js yang menjalankan Express, jadi dua pelajaran berikutnya memberimu kode yang berfungsi untuk stack itu persis. Langkah yang sama bisa dipindahkan ke framework atau bahasa apa pun; hanya sintaksnya yang berubah.

Pertama, BananaSeed butuh akun dan kunci situs. Sekitar dua menit, tanpa kartu kredit, belum ada yang perlu dipasang.

Apa yang akan kamu miliki di akhir

• Sebuah akun Caputchin.
• Satu kunci situs, yang sebenarnya adalah sepasang nilai:
  • sebuah public key (cpt_pub_...) yang masuk ke halamanmu,
  • sebuah secret (cpt_sec_...) yang tetap di servermu.

1. Masuk (ini juga membuat akunmu)

Buka caputchin.com/login. Tak ada langkah pendaftaran terpisah: masuk pertamamu dengan sebuah email itulah yang membuat akun. Pilih mana saja yang kamu suka:

• Kirimkan tautan masuk lewat email, lalu klik tautan di email itu, atau
• Lanjutkan dengan GitHub, atau
• Lanjutkan dengan Google.

Kami hanya pernah membaca alamat email terverifikasimu.

Begitu kamu masuk, perhatikan bilah alamat menunjukkan /app/troops. Caputchin menjatuhkanmu langsung ke dalam tim-mu.

2. Buka tim Personal-mu

Sebelum kamu membuat kunci situs, ada gunanya tahu di mana ia berada. Hampir segalanya di Caputchin berada di dalam sebuah tim. Sebuah tim adalah ruang kerja, dan ia adalah hal yang memiliki kunci situs-mu, kustomisasi game yang dibagi key-key itu, dan (di paket berbayar) rekan tim yang kamu undang untuk membantu mengelolanya. Caputchin dibangun di sekitar tim dengan sengaja: sebuah kunci situs selalu milik sebuah tim, tak pernah langsung milik akunmu, dan itulah yang membuat seluruh tim bisa mengelola key yang sama nanti tanpa berbagi login. Penagihan dan kursi berada di tingkat akun, di atas tim-mu, bukan di dalam salah satunya.

Setiap akun dimulai dengan satu tim bernama Personal, yang hanya berisi kamu. Itu semua yang kamu butuhkan untuk panduan ini. Saat kamu melampauinya, kamu membuat tim bersama dan mengundang anggota, tapi tak ada yang berubah di bawah ini.

Klik Personal untuk membukanya. Sebuah tim terbuka langsung ke Kunci situs-nya, jadi di situlah kamu mendarat. Perhatikan bilah alamat: /app/troops/<id>/site-keys. Key yang akan kamu buat tersarang di bawah tim, persis kepemilikan yang baru saja kami jelaskan.

3. Buat kunci situs pertamamu

Klik Buat kunci situs, beri nama seperti My site, lalu klik Buat. Sebuah nama saja yang ia minta.

Caputchin menunjukkan dua nilai kepadamu:

Perhatikan spanduknya: "Salin secret sekarang. Kami tak akan menunjukkannya lagi." Salin secret itu dan simpan di suatu tempat yang bisa dibaca servermu (sebuah variabel lingkungan, manajer secret-mu). Kamu selalu bisa melihat public key lagi di halaman Integration key tersebut, tapi secret ditunjukkan tepat sekali. Jika kamu kehilangannya, kamu memutarnya alih-alih memulihkannya.

Sebuah key yang baru dibuat belum punya pembatasan origin, dan itulah yang membuat halaman ujimu berfungsi secara lokal di pelajaran berikutnya. Lebih lanjut tentang pengaturan sebuah key di Kunci situs.

Apa yang baru saja terjadi

Kamu punya akun dan kunci situs pertamamu, fondasi tempat semuanya yang lain dibangun. Bagus sekali. 🎉

Berikutnya

Kamu punya key-mu. Saatnya menaruh widget di sebuah halaman dan menyaksikan verifikasi sungguhan terjadi.

Lanjut ke Tambahkan widget ke situsmu.