reCAPTCHA v3 menampilkan skor untuk setiap permintaan tanpa hambatan pengguna. Skor ini didasarkan pada interaksi dengan situs Anda dan memungkinkan Anda mengambil tindakan yang sesuai untuk situs Anda. Daftarkan kunci reCAPTCHA v3 di konsol Admin reCAPTCHA.
Halaman ini menjelaskan cara mengaktifkan dan menyesuaikan reCAPTCHA v3 di halaman web Anda.
Penempatan di situs Anda
reCAPTCHA v3 tidak akan pernah mengganggu pengguna, sehingga Anda dapat menjalankannya kapan saja sesuai keinginan tanpa memengaruhi konversi. reCAPTCHA berfungsi paling baik jika memiliki konteks paling banyak tentang interaksi dengan situs Anda, yang berasal dari melihat perilaku yang sah dan melecehkan. Oleh karena itu, sebaiknya sertakan verifikasi reCAPTCHA di formulir atau tindakan serta di latar belakang halaman untuk analisis.
Anda dapat menjalankan reCAPTCHA di banyak tindakan yang diinginkan pada halaman yang sama.
Secara otomatis mengikat tantangan ke tombol
Metode termudah untuk menggunakan reCAPTCHA v3 di halaman Anda adalah dengan menyertakan resource JavaScript yang diperlukan dan menambahkan beberapa atribut ke tombol html Anda.
Memuat JavaScript API.
<script src="https://www.google.com/recaptcha/api.js"></script>
Tambahkan fungsi callback untuk menangani token.
<script> function onSubmit(token) { document.getElementById("demo-form").submit(); } </script>
Tambahkan atribut ke tombol html Anda.
<button class="g-recaptcha" data-sitekey="reCAPTCHA_site_key" data-callback='onSubmit' data-action='submit'>Submit</button>
Memanggil tantangan secara terprogram
Jika ingin memiliki kontrol lebih besar terhadap kapan reCAPTCHA berjalan, Anda dapat menggunakan metode execute
dalam objek grecaptcha
. Untuk melakukannya, Anda harus menambahkan parameter render
ke pemuatan skrip reCAPTCHA.
Muat JavaScript API dengan kunci situs Anda.
<script src="https://www.google.com/recaptcha/api.js?render=reCAPTCHA_site_key"></script>
Panggil
grecaptcha.execute
pada setiap tindakan yang ingin Anda lindungi.<script> function onClick(e) { e.preventDefault(); grecaptcha.ready(function() { grecaptcha.execute('reCAPTCHA_site_key', {action: 'submit'}).then(function(token) { // Add your logic to submit to your backend server here. }); }); } </script>
Kirim token segera ke backend Anda dengan permintaan untuk memverifikasi.
Menafsirkan skor
reCAPTCHA v3 menampilkan skor (1,0 sangat mungkin merupakan interaksi yang baik, 0,0 sangat mungkin bot). Berdasarkan skornya, Anda dapat mengambil tindakan variabel dalam konteks situs Anda. Setiap situs berbeda, tetapi di bawah ini adalah beberapa contoh bagaimana situs menggunakan skor. Seperti pada contoh di bawah, ambil tindakan di balik layar dan bukan memblokir traffic untuk melindungi situs Anda dengan lebih baik.
Kasus penggunaan | Recommendation |
---|---|
halaman utama | Lihat tampilan kohesif traffic Anda di konsol admin sambil memfilter scraper. |
login | Dengan skor rendah, wajibkan autentikasi 2 faktor atau verifikasi email untuk mencegah serangan penjejalan kredensial. |
sosial | Batasi permintaan pertemanan yang belum terjawab dari pengguna yang melakukan penyalahgunaan dan kirim komentar berisiko pada moderasi. |
e-commerce | Tempatkan penjualan Anda yang sebenarnya di depan bot dan identifikasikan transaksi yang berisiko. |
reCAPTCHA belajar dengan melihat traffic nyata di situs Anda. Karena alasan ini, skor dalam lingkungan staging atau segera setelah penerapan mungkin berbeda dari produksi. Karena reCAPTCHA v3 tidak pernah mengganggu alur penggunaan, Anda dapat menjalankan reCAPTCHA terlebih dahulu tanpa mengambil tindakan, lalu memutuskan batas dengan melihat traffic di konsol admin. Secara default, Anda dapat menggunakan nilai minimum 0,5.
Tindakan
reCAPTCHA v3 memperkenalkan konsep baru: tindakan. Saat Anda menentukan nama tindakan di setiap tempat Anda menjalankan reCAPTCHA, aktifkan fitur baru berikut:
- Pengelompokan data mendetail untuk sepuluh tindakan teratas Anda di konsol admin
- Analisis risiko adaptif berdasarkan konteks tindakan, karena perilaku pelecehan dapat bervariasi.
Yang penting, saat memverifikasi respons reCAPTCHA, Anda harus memverifikasi bahwa nama tindakan tersebut adalah nama yang Anda harapkan.
Respons Verifikasi Situs
Buat permintaan untuk memverifikasi token respons seperti reCAPTCHA v2 atau reCAPTCHA tidak terlihat.
Responsnya adalah objek JSON:
{
"success": true|false, // whether this request was a valid reCAPTCHA token for your site
"score": number // the score for this request (0.0 - 1.0)
"action": string // the action name for this request (important to verify)
"challenge_ts": timestamp, // timestamp of the challenge load (ISO format yyyy-MM-dd'T'HH:mm:ssZZ)
"hostname": string, // the hostname of the site where the reCAPTCHA was solved
"error-codes": [...] // optional
}
Tips
grecaptcha.ready()
menjalankan fungsi Anda saat library reCAPTCHA dimuat. Untuk menghindari kondisi race denganapi.js
, sertakanapi.js
sebelum skrip Anda yang memanggil grecaptcha, atau terus gunakan callback onload yang ditentukan dengan v2 API.- Coba hubungkan panggilan
execute
ke tindakan yang menarik atau sensitif seperti Daftar, Reset Sandi, Pembelian, atau Putar. - Gunakan
https://www.google.com/recaptcha/api.js?trustedtypes=true
untuk memuat kode yang kompatibel dengan Jenis Tepercaya.