reCAPTCHA เวอร์ชัน 3

reCAPTCHA v3 จะแสดงผลคะแนนสำหรับคำขอแต่ละรายการโดยไม่รบกวนผู้ใช้ คะแนนจะคำนวณจากการโต้ตอบกับเว็บไซต์ และช่วยให้คุณดำเนินการที่เหมาะสมกับเว็บไซต์ได้ ลงทะเบียนคีย์ reCAPTCHA v3 ในคอนโซลผู้ดูแลระบบ reCAPTCHA

หน้านี้จะอธิบายวิธีเปิดใช้และปรับแต่ง reCAPTCHA v3 ในหน้าเว็บ

ตำแหน่งในเว็บไซต์ของคุณ

reCAPTCHA v3 จะไม่รบกวนผู้ใช้ คุณจึงเรียกใช้ได้ทุกเมื่อที่ต้องการโดยไม่ส่งผลต่อ Conversion ทั้งนี้ reCAPTCHA จะทำงานได้ดีที่สุดเมื่อมีบริบทเกี่ยวกับการโต้ตอบกับเว็บไซต์มากที่สุด ซึ่งมาจากการเห็นทั้งพฤติกรรมที่ถูกต้องตามกฎหมายและการละเมิด ด้วยเหตุนี้ เราขอแนะนำให้คุณใส่การยืนยัน reCAPTCHA ในแบบฟอร์มหรือการดำเนินการ รวมถึงในเบื้องหลังของหน้าสำหรับข้อมูลวิเคราะห์

หมายเหตุ: โทเค็น reCAPTCHA จะหมดอายุหลังจากผ่านไป 2 นาที หากคุณกำลังปกป้องการดำเนินการด้วย reCAPTCHA โปรดเรียกใช้ execute เมื่อผู้ใช้ดำเนินการแทนการโหลดหน้าเว็บ

คุณใช้งาน reCAPTCHA กับการดำเนินการต่างๆ บนหน้าเดียวกันได้เท่าที่ต้องการ

เชื่อมโยงภารกิจกับปุ่มโดยอัตโนมัติ

วิธีที่ง่ายที่สุดในการใช้ reCAPTCHA v3 ในหน้าเว็บคือการรวมทรัพยากร JavaScript ที่จำเป็นและเพิ่มแอตทริบิวต์ 2-3 รายการลงในปุ่ม HTML

1. โหลด JavaScript API

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

2. เพิ่มฟังก์ชัน Callback เพื่อจัดการโทเค็น

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

3. เพิ่มแอตทริบิวต์ลงในปุ่ม HTML

   <button class="g-recaptcha" 
           data-sitekey="reCAPTCHA_site_key" 
           data-callback='onSubmit' 
           data-action='submit'>Submit</button>
   

เรียกใช้ชาเลนจ์แบบเป็นโปรแกรม

หากต้องการควบคุมมากขึ้นเมื่อ reCAPTCHA ทำงาน คุณใช้เมธอด execute ในออบเจ็กต์ grecaptcha ได้ โดยคุณต้องเพิ่มพารามิเตอร์ render ลงในการโหลดสคริปต์ reCAPTCHA

1. โหลด JavaScript API ด้วยคีย์เว็บไซต์

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

2. โทรหา grecaptcha.execute เกี่ยวกับการดำเนินการที่คุณต้องการปกป้อง

      <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. ส่งโทเค็นไปยังแบ็กเอนด์ทันทีพร้อมคำขอเพื่อยืนยัน

การแปลคะแนน

reCAPTCHA v3 แสดงคะแนน (1.0 คือการโต้ตอบที่ดี 0.0 น่าจะเป็นบ็อตอย่างมาก) คุณสามารถใช้การดำเนินการที่เปลี่ยนแปลงได้ตามบริบทของเว็บไซต์ ทั้งนี้ขึ้นอยู่กับคะแนนของคุณ เว็บไซต์แต่ละแห่งแตกต่างกัน แต่ด้านล่างนี้คือตัวอย่างการใช้คะแนนของเว็บไซต์ ดังในตัวอย่างด้านล่าง คุณควรดำเนินการอยู่เบื้องหลังแทนการบล็อกการเข้าชมเพื่อปกป้องเว็บไซต์ให้ดียิ่งขึ้น

กรณีการใช้งาน	คำแนะนำ
หน้าแรก	ดูมุมมองการเข้าชมแบบต่อเนื่องในคอนโซลผู้ดูแลระบบ ขณะกรองสเครเปอร์
เข้าสู่ระบบ	หากมีคะแนนต่ำ จะต้องมีการตรวจสอบสิทธิ์แบบ 2 ปัจจัยหรือการยืนยันอีเมลเพื่อป้องกันการโจมตีด้วยการสวมข้อมูลเข้าสู่ระบบ
social	จำกัดคำขอเป็นเพื่อนที่ไม่ได้รับคำตอบจากผู้ใช้ที่ละเมิดและส่งความคิดเห็นที่มีความเสี่ยงเพื่อให้มีการกลั่นกรอง
อีคอมเมิร์ซ	วางแผนการขายจริงของคุณให้รู้เท่าทันบ็อต และระบุธุรกรรมที่มีความเสี่ยง

reCAPTCHA เรียนรู้จากการดูการเข้าชมจริงในเว็บไซต์ ด้วยเหตุนี้ คะแนนในสภาพแวดล้อมการทดลองใช้หรือหลังจากนำไปใช้ไม่นานจึงอาจแตกต่างจากเวอร์ชันที่ใช้งานจริง เนื่องจาก reCAPTCHA v3 จะไม่รบกวนการรับส่งข้อมูลของผู้ใช้ คุณจึงเรียกใช้ reCAPTCHA ก่อนได้โดยไม่ต้องดำเนินการแล้วค่อยตัดสินใจเกี่ยวกับเกณฑ์โดยดูการรับส่งข้อมูลในคอนโซลผู้ดูแลระบบ โดยค่าเริ่มต้น คุณสามารถใช้เกณฑ์ที่ 0.5

การดำเนินการ

reCAPTCHA v3 เปิดตัวแนวคิดใหม่ "การดำเนินการ" เมื่อคุณระบุชื่อการดำเนินการในแต่ละตำแหน่งที่เรียกใช้ reCAPTCHA จะเป็นการเปิดใช้ฟีเจอร์ใหม่ดังต่อไปนี้

• ข้อมูลแจกแจงโดยละเอียดสำหรับการดำเนินการ 10 อันดับแรกในคอนโซลผู้ดูแลระบบ
• การวิเคราะห์ความเสี่ยงแบบปรับเปลี่ยนได้ตามบริบทของการดำเนินการ เนื่องจากพฤติกรรมที่เป็นการละเมิดอาจแตกต่างกันไป

และที่สำคัญ เมื่อยืนยันการตอบกลับ reCAPTCHA คุณควรยืนยันว่าชื่อการดำเนินการเป็นชื่อที่คุณคาดไว้

หมายเหตุ: การดําเนินการอาจมีเฉพาะอักขระที่เป็นตัวอักษรและตัวเลขคละกัน เครื่องหมายทับ และขีดล่างเท่านั้น การดําเนินการจะต้องไม่เจาะจงผู้ใช้

การตอบกลับการยืนยันเว็บไซต์

ส่งคำขอเพื่อยืนยันโทเค็นการตอบกลับด้วย reCAPTCHA v2 หรือ reCAPTCHA ที่ไม่แสดง

การตอบสนองจะเป็นออบเจ็กต์ 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
}

เคล็ดลับ

1. grecaptcha.ready() จะเรียกใช้ฟังก์ชันเมื่อไลบรารี reCAPTCHA โหลดขึ้น หากต้องการหลีกเลี่ยงเงื่อนไขในการแข่งขันกับ api.js ให้ใส่ api.js หน้าสคริปต์ที่เรียกใช้ grecaptcha หรือใช้ onload Callback ที่กำหนดไว้ด้วย v2 API ต่อไป
2. ลองเกี่ยวเนื่องกับการเรียก execute กับการดำเนินการที่น่าสนใจหรือมีความละเอียดอ่อน เช่น ลงทะเบียน รีเซ็ตรหัสผ่าน ซื้อ หรือ Play
3. ใช้ https://www.google.com/recaptcha/api.js?trustedtypes=true เพื่อโหลดโค้ดที่เข้ากันได้กับ Trusted Types