WAF 및 Google Cloud Armor 통합 기능을 위한 reCAPTCHA Enterprise 구현

이 문서에서는 Google Cloud Armor의 reCAPTCHA 챌린지 페이지, reCAPTCHA 작업 토큰, reCAPTCHA 세션 토큰을 구현하는 방법을 보여줍니다.

시작하기 전에

reCAPTCHA 작업 토큰 또는 세션 토큰을 사용하려면 다음 단계를 수행하여 reCAPTCHA Enterprise API를 사용 설정합니다.

  1. Cloud Console에서 reCAPTCHA Enterprise API 페이지로 이동합니다.

    reCAPTCHA Enterprise API로 이동

  2. 페이지 상단의 프로젝트 선택기에 프로젝트 이름이 표시되는지 확인합니다.

    프로젝트 이름이 표시되지 않으면 프로젝트 선택기를 클릭한 다음 프로젝트를 선택합니다.

  3. 사용 설정을 클릭합니다.

reCAPTCHA 챌린지 페이지 구현

reCAPTCHA Enterprise는 구현을 자동으로 처리하므로 reCAPTCHA 챌린지 페이지의 구현 단계는 없습니다.

다음 단계로 Google Cloud Armor 보안 정책을 구성합니다.

reCAPTCHA 작업 토큰 구현

작업 토큰을 생성하려면 웹페이지에서 reCAPTCHA Enterprise를 실행해야 합니다. reCAPTCHA Enterprise가 작업 토큰을 생성한 후에는 결제와 같은 사용자 작업을 보호해야 하는 경우에 사전 정의된 요청 헤더에 작업 토큰을 연결합니다. 기본적으로 작업 토큰은 30분 동안 유효하며 유효 시간이 더 짧을 수도 있습니다. 따라서 Google Cloud Armor가 토큰 속성을 평가할 수 있도록 토큰이 만료되기 전에 작업 토큰을 사전 정의된 요청 헤더에 연결해야 합니다.

reCAPTCHA 작업 토큰을 구현하려면 다음 안내를 따르세요.

  1. 새 reCAPTCHA 점수 기반 또는 체크박스 사이트 키를 만듭니다.
  2. 사이트 키에 작업 토큰 기능을 사용 설정하려면 사이트 키를 recaptcha-waf-eng@google.com으로 보냅니다.
  3. 사이트 키에 작업 토큰 기능이 사용 설정되면 확인 이메일을 받게 됩니다.
  4. 웹페이지에 사용 설정된 사이트 키를 설치합니다. 자세한 내용은 사이트 키에 해당하는 문서를 참조하세요.

  5. reCAPTCHA Enterprise에서 토큰을 받은 후 이 토큰을 사전 정의된 요청 헤더에 다음 형식으로 연결합니다.

       X-Recaptcha-Token:value-of-your-action-token
    

    XHR, Ajax, Fetch API와 같은 언어를 사용하여 토큰을 사전 정의된 요청 헤더에 연결할 수 있습니다.

다음 샘플 스크립트는 실행 작업을 보호하고 자바스크립트와 XHR을 사용하여 사전 정의된 요청 헤더에 토큰을 연결하는 방법을 보여줍니다.

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

    <script>

     function onSuccess(action_token) {
       const xhr = new XMLHttpRequest();
       xhr.open('GET','YOUR_URL', false);
       // Attach the action-token to the predefined request header
       xhr.setRequestHeader("X-Recaptcha-Token", action_token);
       xhr.send(null);
     }

     function onError(reason) {
       alert('Response promise rejected: ' + reason);
     }

     grecaptcha.enterprise.ready(function () {
       document.getElementById("execute-button").onclick = () => {
         grecaptcha.enterprise.execute('SITE_KEY_ACTION_TOKEN_ENABLED', {
         }).then(onSuccess, onError);
       };
     });
    </script>

다음 단계로 Google Cloud Armor 보안 정책을 구성합니다.

reCAPTCHA 세션 토큰 구현

reCAPTCHA 자바스크립트는 평가 후 최종 사용자의 브라우저에서 reCAPTCHA 세션 토큰을 쿠키로 설정합니다. reCAPTCHA 자바스크립트가 활성 상태로 유지되는 동안 최종 사용자의 브라우저는 쿠키를 연결하고 새로 고칩니다.

세션 토큰을 쿠키로 제공하려면 다음 요구사항을 충족하는 하나 이상의 웹페이지에 reCAPTCHA 점수 기반 사이트 키를 설치합니다.

  • 웹페이지는 보호해야 하는 페이지 이전에 최종 사용자가 탐색하는 페이지여야 합니다. 예를 들어 결제 페이지를 보호하려면 홈페이지 또는 제품 페이지에 reCAPTCHA 점수 기반 사이트 키를 설치합니다.
  • 웹페이지는 Google Cloud Armor 보안 정책으로 보호됩니다.

이 쿠키를 사용하여 특정 도메인에서 사용자의 후속 요청 및 페이지 로드를 보호할 수 있습니다. 세션 토큰은 기본적으로 30분 동안 유효합니다. 하지만 세션 토큰을 구현한 페이지에 사용자가 머무르면 reCAPTCHA Enterprise가 세션 토큰을 주기적으로 새로고침하여 만료되지 않습니다.

reCAPTCHA Enterprise로 보호해야 하는 각 페이지에 세션 토큰을 설치합니다. 모든 페이지에 reCAPTCHA Enterprise를 설치하고 Google Cloud Armor 규칙을 사용하여 최종 사용자가 탐색하는 첫 번째 페이지를 제외한 모든 페이지에 액세스를 적용하는 것이 좋습니다.

다음은 reCAPTCHA 세션 토큰의 샘플입니다.

   recaptcha-ca-t=value-of-your-session-token;domain=domain;expires=expiration_time

reCAPTCHA 세션 토큰을 구현하려면 다음 안내를 따르세요.

  1. 새 reCAPTCHA 점수 기반 사이트 키를 만듭니다.
  2. 사이트 키에 세션 토큰 기능을 사용 설정하려면 사이트 키를 recaptcha-waf-eng@google.com으로 보냅니다.
  3. 사이트 키에 세션 토큰 기능이 사용 설정되면 확인 이메일을 받게 됩니다.
  4. 세션 토큰 기능 및 waf=session이 사용 설정된 사이트 키를 reCAPTCHA 자바스크립트에 추가합니다.

다음 샘플 스크립트는 웹페이지에 세션 토큰을 구현하는 방법을 보여줍니다.

    <!DOCTYPE html>
    <html lang="en">
    <head>
     <meta charset="UTF-8">
     <title>reCAPTCHA WAF Session Token</title>
     <script src="https://www.google.com/recaptcha/enterprise.js?render=SITE_KEY_SESSION_TOKEN_ENABLED&waf=session" async defer></script>
    </head>
  </html>

다음 단계로 Google Cloud Armor 보안 정책을 구성합니다.

단일 애플리케이션에서 둘 이상의 기능을 사용하는 예시

단일 애플리케이션에서 WAF 기능에 1개 이상의 reCAPTCHA Enterprise를 사용할 수 있습니다.

예시 1: reCAPTCHA 세션 토큰 및 reCAPTCHA 챌린지 페이지 사용

사용자가 액세스할 수 있는 페이지에 reCAPTCHA 세션 토큰을 추가하여 쿠키가 주기적으로 새로고침되도록 할 수 있습니다(예: 로그인 페이지). 점수가 낮을 경우 Google Cloud Armor 보안 정책 규칙을 구성하여 요청을 reCAPTCHA 챌린지 페이지로 리디렉션합니다.

다음 이미지는 reCAPTCHA 세션 토큰과 reCAPTCHA 챌린지 페이지 기능을 사용하는 워크플로를 보여줍니다.

예시 2: reCAPTCHA 작업 토큰 및 reCAPTCHA 챌린지 페이지 사용

reCAPTCHA 작업 토큰을 추가하여 결제와 같은 사용자 작업을 보호할 수 있습니다. 다음 조건에서 Google Cloud Armor 보안 정책 규칙을 구성하여 reCAPTCHA 챌린지 페이지로 요청을 리디렉션합니다.

  • 점수가 낮습니다.
  • 작업 토큰의 action_name 속성이 보호되는 사용자 작업과 일치하지 않습니다.

다음 이미지는 reCAPTCHA 작업 토큰 및 reCAPTCHA 챌린지 페이지 기능을 사용하는 워크플로를 보여줍니다.

다음 샘플 스크립트는 reCAPTCHA 작업 토큰을 사용하고 작업 토큰이 헤더로 연결된 reCAPTCHA 챌린지 페이지로 리디렉션하는 방법을 보여줍니다.

   <script src="https://www.google.com/recaptcha/enterprise.js?render=SITE_KEY_ACTION_TOKEN_ENABLED"></script>
    <script>
     function onSuccess(token) {
       const xhr = new XMLHttpRequest();
       xhr.open('GET','http://www.abc.com/checkout', false);
       xhr.setRequestHeader("X-Recaptcha-Token", token);
       xhr.onreadystatechange = function() {
         // Make sure that the request is finished and response is ready with 200
         if (this.readyState == 4 && this.status == 200) {
           // Display the response, it could be the reCAPTCHA challenge
           // page based on your Google Cloud Armor security rule settings.
            document.open();
            document.write(xhr.responseText);
            document.close();

         }
       };
       xhr.send(null);
     }

     grecaptcha.enterprise.ready(function () {
       document.getElementById("execute-button").onclick = () => {
         grecaptcha.enterprise.execute('SITE_KEY_ACTION_TOKEN_ENABLED', {
         }).then(onSuccess, onError);
       };
     });
    </script>

다음 단계