reCAPTCHA v3

reCAPTCHA v3 menampilkan skor untuk setiap permintaan tanpa hambatan pengguna. Skor tersebut didasarkan pada interaksi dengan situs dan memungkinkan Anda mengambil tindakan yang sesuai untuk situs. 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 Anda, sehingga Anda dapat menjalankannya kapan saja tanpa memengaruhi konversi. reCAPTCHA berfungsi optimal jika memiliki konteks terbanyak terkait interaksi dengan situs Anda, karena melihat perilaku yang sah dan menyinggung. Karena alasan ini, sebaiknya termasuk verifikasi reCAPTCHA pada formulir atau tindakan serta di latar belakang halaman untuk Analytics.

Anda dapat menjalankan reCAPTCHA pada sebanyak mungkin tindakan di halaman yang sama.

Secara otomatis mengikat tantangan ke tombol

Metode termudah untuk menggunakan reCAPTCHA v3 di halaman Anda adalah menyertakan sumber daya JavaScript yang diperlukan dan tambahkan beberapa atribut ke tombol html Anda.

  1. Muat JavaScript API.

     <script src="https://www.google.com/recaptcha/api.js"></script>

  2. Tambahkan fungsi callback untuk menangani token.

     <script>
   function onSubmit(token) {
     document.getElementById("demo-form").submit();
   }
 </script>

  3. 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 Anda ingin memiliki kontrol lebih besar atas kapan reCAPTCHA dijalankan, Anda dapat menggunakan Metode execute dalam objek grecaptcha. Untuk melakukannya: Anda perlu menambahkan parameter render ke pemuatan skrip reCAPTCHA.

  1. Muat JavaScript API dengan kunci situs Anda.

    <script src="https://www.google.com/recaptcha/api.js?render=reCAPTCHA_site_key"></script>

  2. Panggil grecaptcha.execute di 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>

  3. Kirim token segera ke backend Anda dengan permintaan untuk verifikasi.

Menafsirkan skor

reCAPTCHA v3 mengembalikan skor (1.0 sangat mungkin merupakan interaksi yang baik, 0.0 sangat mungkin adalah bot). Berdasarkan skor tersebut, Anda dapat melakukan tindakan variabel dalam konteks situs Anda. Setiap situs yang berbeda, namun di bawah ini adalah beberapa contoh tentang bagaimana situs menggunakan skor tersebut. Seperti pada contoh di bawah ini, ambil tindakan di balik layar, alih-alih memblokir traffic, untuk melindungi situs Anda dengan lebih baik.

Kasus penggunaan Rekomendasi
beranda Lihat tampilan traffic yang kohesif di konsol Admin sambil memfilter scraper.
login Dengan skor yang rendah, wajibkan autentikasi 2 faktor atau verifikasi email untuk mencegah serangan penjejalan kredensial.
sosial Batasi permintaan pertemanan yang tidak terjawab dari pengguna yang melakukan pelecehan dan kirim komentar berisiko ke moderasi.
e-commerce Tonjolkan penjualan asli Anda daripada bot dan identifikasi transaksi yang berisiko.

reCAPTCHA belajar dengan melihat traffic sungguhan di situs Anda. Karena alasan ini, skor dalam staging lingkungan atau segera setelah penerapan mungkin berbeda dari produksi. Karena reCAPTCHA v3 tidak pernah mengganggu alur pengguna, pertama-tama Anda dapat menjalankan reCAPTCHA tanpa mengambil tindakan, lalu memutuskan dengan melihat traffic Anda di konsol admin. Menurut secara {i>default<i}, Anda dapat menggunakan ambang batas 0,5.

Tindakan

reCAPTCHA v3 memperkenalkan konsep baru: tindakan. Saat Anda menentukan nama tindakan di setiap tempat Anda mengeksekusi reCAPTCHA, Anda mengaktifkan fitur baru berikut:

  • Perincian data terperinci untuk sepuluh tindakan teratas Anda dalam konsol admin
  • Analisis risiko adaptif berdasarkan konteks tindakan, karena penyalahgunaan dapat bervariasi.

Yang penting, saat memverifikasi respons reCAPTCHA, Anda harus memverifikasi bahwa nama tindakan adalah nama yang Anda harapkan.

Respons Verifikasi Situs

Buat permintaan untuk memverifikasi token respons seperti dengan 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

  1. grecaptcha.ready() menjalankan fungsi Anda saat library reCAPTCHA dimuat. Kepada menghindari kondisi race dengan api.js, sertakan api.js sebelum skrip yang memanggil {i>grecaptcha<i}, atau terus menggunakan callback onload yang ditentukan dengan API v2.
  2. Coba kaitkan pesan execute ke tindakan yang menarik atau sensitif seperti Daftar, Reset Sandi, Beli, atau Mainkan.
  3. Gunakan https://www.google.com/recaptcha/api.js?trustedtypes=true untuk memuat kode yang kompatibel dengan Jenis Tepercaya.