계정 탈취 감지 및 방지

이 페이지에서는 reCAPTCHA를 사용하여 계정 탈취(ATO)를 감지하고 방지하는 방법을 설명합니다.

ATO 공격은 일반적으로 정보 유출로부터 가져온 사용자 인증 정보를 사용하여 API 엔드포인트에 로그인하도록 요청을 전송합니다. 비밀번호 덤프라고도 합니다. 사용자는 여러 계정에서 암호를 재사용하는 경향이 있기 때문에 비밀번호 덤프가 관련이 없는 사이트에서 온 경우에도 이러한 유형의 공격이 성공할 수 있습니다. 이 유형의 공격은 비밀번호 관리자 사용과 같은 적절한 비밀번호 관리를 사용하는 사용자에게는 영향을 주지 않습니다.

시작하기 전에

reCAPTCHA 환경을 준비합니다.

ATO 감지 및 방지

reCAPTCHA를 사용하면 다음 옵션 중 하나를 사용하여 ATO를 감지하고 방지할 수 있습니다.

로봇이 아닙니다 체크박스 사용

사이트에 로봇이 아닙니다 체크박스를 추가하는 것이 SMS 또는 이메일 확인과 같은 추가 기능을 통합하지 않고도 ATO로부터 보호할 수 있는 가장 빠르고 쉬운 방법입니다. 공격자가 이 보호 조치를 해제하는 데 드는 비용이 발생하며 이 옵션은 일부 사이트에 충분할 수도 있습니다.

웹페이지에 '로봇이 아닙니다' 체크박스를 추가합니다.

다음 코드는 체크박스로 보호되는 로그인 페이지의 라이브 예시입니다.

function onSuccess(token) {
  // The token is included in the POST data in the g-recaptcha-response
  // parameter. The backend must create an Assessment with the token
  // and verify the token is valid.
  console.log(token);
}
 
<form id="loginForm" action="?" method="POST">
  Username: <input type="text" name="username"/><br/>
  Password: <input type="password" name="password"/><br/>
  <div class="g-recaptcha" data-sitekey="reCATCHA_sitekey"
       data-action="account_login" data-callback="onSuccess"></div>
</form>
 
<script src="https://www.google.com/recaptcha/enterprise.js" async defer></script>

코드 창의 오른쪽 상단에 있는 <> 아이콘을 클릭하여 JSFiddle에서 이 코드를 실험할 수 있습니다.

<html>
  <head>
    <title>Account Login - Checkbox</title>
    <script src="https://www.google.com/recaptcha/enterprise.js" async defer></script>
    <script>
    function onSuccess(token) {
      // The token is included in the POST data in the g-recaptcha-response
      // parameter. The backend must create an Assessment with the token
      // and verify the token is valid.
      console.log(token);
    }
    </script>
  </head>
  <body>
    <form id="loginForm" action="?" method="POST">
      Username: <input type="text" name="username"/><br/>
      Password: <input type="password" name="password"/><br/>
      <div class="g-recaptcha" data-sitekey="6LeAkOgUAAAAACcy3uY6N9H9SJMS27n3Zx2OOnYK"
           data-action="account_login" data-callback="onSuccess"></div>
    </form>
  </body>
</html>

점수 및 커스텀 챌린지 사용

ATO로부터 보호하기 위해서는 reCAPTCHA 점수 기반 키를 사용하고 이메일 및 SMS 인증과 같은 다중 인증(MFA)을 통해 사용자에게 일회용 코드(OTP)를 전송합니다.

점수 기반 키와 커스텀 챌린지를 사용하려면 다음 옵션을 고려하세요.

사용 사례에 따라 단독으로 또는 점수 기반 키와 함께 MFA를 사용할 수 있습니다. 예를 들어 마찰을 줄이기 위해 특정 임곗값 미만의 점수에만 MFA 챌린지를 사용할 수 있습니다.

다음 예시에서는 로그인 시나리오에서 점수 기반 키를 통합하는 방법을 보여줍니다.

function submitForm() {
  grecaptcha.enterprise.ready(function() {
    grecaptcha.enterprise.execute(
      'reCAPTCHA_site_key', {action: 'account_login'}).then(function(token) {
       document.getElementById("token").value = token;
       document.getElementByID("loginForm").submit();
    });
  });
}
 
<form id="loginForm" action="?" method="POST">
  Username: <input type="text" name="username"/><br/>
  Password: <input type="password" name="password"/><br/>
  <input type="hidden" id="token" name="recaptcha_token"/>
  <button onclick="submitForm()">Login</button>
</form>
 
<script src="https://www.google.com/recaptcha/enterprise.js" async defer></script>

코드 창의 오른쪽 상단에 있는 <> 아이콘을 클릭하여 JSFiddle에서 이 코드를 실험할 수 있습니다.

<html>
  <head>
    <title>Account Login - Score</title>
    <script src="https://www.google.com/recaptcha/enterprise.js" async defer></script>
    <script>
    function submitForm() {
      grecaptcha.enterprise.ready(function() {
        grecaptcha.enterprise.execute(
          'reCAPTCHA_site_key', {action: 'account_login'}).then(function(token) {
           document.getElementById("token").value = token;
           document.getElementByID("loginForm").submit();
        });
      });
    }
    </script>
  </head>
  <body>
    <form id="loginForm" action="?" method="POST">
      Username: <input type="text" name="username"/><br/>
      Password: <input type="password" name="password"/><br/>
      <input type="hidden" id="token" name="recaptcha_token"/>
      <button onclick="submitForm()">Login</button>
    </form>
  </body>
</html>

다음 단계