reCAPTCHA phiên bản 3

reCAPTCHA v3 sẽ trả về điểm số cho từng yêu cầu mà không gây trở ngại cho người dùng. Điểm số này dựa trên các lượt tương tác với trang web của bạn và cho phép bạn thực hiện hành động thích hợp cho trang web đó. Đăng ký khoá reCAPTCHA v3 trên Bảng điều khiển dành cho quản trị viên reCAPTCHA.

Trang này giải thích cách bật và tuỳ chỉnh reCAPTCHA v3 trên trang web.

Vị trí trên trang web của bạn

reCAPTCHA v3 sẽ không bao giờ làm gián đoạn người dùng của bạn. Vì vậy, bạn có thể chạy reCAPTCHA bất cứ khi nào bạn muốn mà không ảnh hưởng đến lượt chuyển đổi. reCAPTCHA hoạt động hiệu quả nhất khi có bối cảnh rõ ràng nhất về hoạt động tương tác với trang web của bạn (tức là xuất hiện cả hành vi hợp pháp và hành vi sai trái). Vì lý do này, bạn nên xác minh reCAPTCHA trên biểu mẫu hoặc hành động cũng như trong nền của trang để phân tích.

Bạn có thể thực thi reCAPTCHA trên nhiều hành động mà bạn muốn trên cùng một trang.

Tự động ràng buộc thử thách với một nút

Cách dễ nhất để sử dụng reCAPTCHA v3 trên trang là thêm tài nguyên JavaScript cần thiết và thêm một vài thuộc tính vào nút html.

  1. Tải API JavaScript.

     <script src="https://www.google.com/recaptcha/api.js"></script>
    
  2. Hãy thêm một hàm gọi lại để xử lý mã thông báo.

     <script>
       function onSubmit(token) {
         document.getElementById("demo-form").submit();
       }
     </script>
    
  3. Thêm các thuộc tính vào nút html.

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

Gọi chương trình thử thách theo phương thức có lập trình

Nếu muốn có thêm quyền kiểm soát đối với thời điểm reCAPTCHA chạy, bạn có thể sử dụng phương thức execute trong đối tượng grecaptcha. Để thực hiện việc này, bạn cần thêm tham số render vào lần tải tập lệnh reCAPTCHA.

  1. Tải API JavaScript bằng khoá trang web.

    <script src="https://www.google.com/recaptcha/api.js?render=reCAPTCHA_site_key"></script>
    
  2. Gọi grecaptcha.execute cho mỗi hành động mà bạn muốn bảo vệ.

       <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. Gửi mã thông báo ngay lập tức đến phần phụ trợ của bạn cùng với yêu cầu xác minh.

Diễn giải điểm số

reCAPTCHA v3 trả về điểm số (1.0 rất có thể là một tương tác tốt, 0.0 rất có thể là một bot). Dựa trên điểm số, bạn có thể thực hiện hành động thay đổi trong ngữ cảnh trang web của mình. Mỗi trang web đều có sự khác biệt, nhưng dưới đây là một số ví dụ về cách các trang web sử dụng điểm số này. Như trong các ví dụ bên dưới, hãy thực hiện hành động đằng sau thay vì chặn lưu lượng truy cập để bảo vệ trang web của bạn tốt hơn.

Trường hợp sử dụng Đề xuất
trang chủ Xem được lưu lượng truy cập nhất quán về lưu lượng truy cập trên bảng điều khiển dành cho quản trị viên trong khi lọc các trình trích xuất dữ liệu.
login Đối với điểm thấp, hãy yêu cầu xác thực 2 yếu tố hoặc xác minh email để ngăn chặn các cuộc tấn công nhồi thông tin xác thực.
social Hạn chế các yêu cầu kết bạn chưa được trả lời của những người dùng lạm dụng và gửi nhận xét có rủi ro cao để kiểm duyệt.
thương mại điện tử Đặt doanh số bán hàng thực của bạn lên trước bot và xác định các giao dịch có rủi ro.

reCAPTCHA học hỏi bằng cách xem lưu lượng truy cập thực sự trên trang web của bạn. Vì lý do này, điểm số trong môi trường thử nghiệm hoặc ngay sau khi triển khai có thể khác với phiên bản chính thức. Vì reCAPTCHA v3 không làm gián đoạn luồng người dùng, nên trước tiên, bạn có thể chạy reCAPTCHA mà không cần làm gì, sau đó quyết định các ngưỡng bằng cách xem lưu lượng truy cập trong bảng điều khiển dành cho quản trị viên. Theo mặc định, bạn có thể sử dụng ngưỡng 0,5.

Thao tác

reCAPTCHA v3 giới thiệu một khái niệm mới: hành động. Khi chỉ định tên hành động ở mỗi vị trí thực thi reCAPTCHA, bạn bật các tính năng mới sau:

  • Bảng phân tích dữ liệu chi tiết về 10 hành động hàng đầu của bạn trong bảng điều khiển dành cho quản trị viên
  • Phân tích rủi ro thích ứng dựa trên bối cảnh của hành động, vì hành vi vi phạm có thể khác nhau.

Quan trọng là khi xác minh phản hồi reCAPTCHA, bạn nên xác minh rằng tên hành động là tên bạn mong đợi.

Phản hồi xác minh trang web

Gửi yêu cầu xác minh mã thông báo phản hồi giống như reCAPTCHA v2 hoặc reCAPTCHA ẩn.

Phản hồi là đối tượng 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
}

Mẹo

  1. grecaptcha.ready() chạy hàm của bạn khi thư viện reCAPTCHA tải. Để tránh các điều kiện tương tranh với api.js, hãy đưa api.js vào trước tập lệnh gọi grecaptcha hoặc tiếp tục sử dụng lệnh gọi lại tải được xác định bằng API phiên bản 2.
  2. Hãy thử nối lệnh gọi execute với các thao tác thú vị hoặc nhạy cảm như Đăng ký, Đặt lại mật khẩu, Mua hàng hoặc Play.
  3. Sử dụng https://www.google.com/recaptcha/api.js?trustedtypes=true để tải mã tương thích với Loại đáng tin cậy.