reCAPTCHA phiên bản 3

reCAPTCHA v3 trả về điểm số cho mỗi yêu cầu mà không gây phiền hà 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 của mình. Đă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 của bạn.

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, vì vậy, bạn có thể chạy reCAPTCHA v3 bất cứ khi nào mình muốn mà không ảnh hưởng đến chuyển đổi. reCAPTCHA hoạt động tốt nhất khi có bối cảnh phù hợp nhất về các lượt tương tác với trang web của bạn, xuất phát từ việc xem xét cả hành vi hợp pháp và hành vi sai trái. Vì lý do này, bạn nên bao gồm việc xác minh bằng reCAPTCHA trên biểu mẫu hoặc hành động cũng như trên nền của các trang số liệu phân tích.

Bạn có thể thực thi reCAPTCHA cho bao nhiêu hành động tuỳ thích trên cùng một trang.

Tự động liên kết thử thách vào một nút

Phương pháp dễ nhất để sử dụng reCAPTCHA v3 trên trang của bạn là đưa tệp 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 của bạn.

  1. Tải API JavaScript.

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

  2. Thêm một hàm callback để xử lý mã thông báo.

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

  3. Thêm thuộc tính vào nút html của bạn.

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

Đưa ra thách thức theo phương thức lập trình

Nếu muốn có nhiều quyền kiểm soát hơn đố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ượt 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 từng 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 ngay mã thông báo đến phần phụ trợ cùng với yêu cầu đến 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 vào điểm số, bạn có thể thực hiện hành động khác nhau trong ngữ cảnh của trang web. Mỗi trang web khác nhau, nhưng dưới đây là một số ví dụ về cách các trang web sử dụng điểm số. Như trong các ví dụ dưới đây, hãy lấy 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 Nội dung đề xuất
trang chủ Xem chế độ xem liền mạch về lưu lượng truy cập của bạn trên bảng điều khiển dành cho quản trị viên khi lọc công cụ khai thác dữ liệu.
đăng nhập Với điểm số thấp, bạn phải 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 nhét thông tin xác thực.
social Hạn chế các yêu cầu kết bạn không được trả lời từ người dùng lạm dụng và gửi nhận xét nguy hiểm để kiểm duyệt.
thương mại điện tử Hãy đặt doanh số bán hàng thực tế của bạn trước bot và xác định các giao dịch rủi ro.

reCAPTCHA học bằng cách xem lưu lượng truy cập thực tế trên trang web của bạn. Vì lý do này, điểm số trong giai đoạn 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 bao giờ làm gián đoạn luồng người dùng, trước tiên bạn có thể chạy reCAPTCHA mà không cần hành động rồi quyết định bằng cách xem lưu lượng truy cập của bạn 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 là 0,5.

Thao tác

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

  • Bản phân tích chi tiết về dữ liệu cho 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
  • Bả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 sai trái hành vi có thể khác nhau.

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

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

Đưa ra yêu cầu xác minh mã thông báo phản hồi giống như với reCAPTCHA v2 hoặc reCAPTCHA vô hình.

Phản hồi là một đố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() sẽ chạy hàm của bạn khi thư viện reCAPTCHA tải. Người nhận tránh điều kiện tranh đấu với api.js, hãy bao gồm api.js trước các tập lệnh gọi grecaptcha hoặc tiếp tục sử dụng lệnh gọi lại onload được xác định bằng API v2.
  2. Hãy thử nối tiếp lệnh gọi execute với các hành động thú vị hoặc nhạy cảm như Đăng ký, Đặt lại mật khẩu, Mua hoặc Chơi.
  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.