reCAPTCHA 추가하기

이메일 입력란이 있는 공개 양식에는 봇이 몰립니다. Google reCAPTCHA는 실제 고객에게 불편을 주지 않으면서 자동화된 제출 대부분을 차단하는 확인 절차를 추가합니다. 앱에서는 이를 “reCAPTCHA offers more than just spam protection”이라고 설명합니다.

설정은 두 단계로 이루어집니다. Google에 스토어를 등록한 다음, Google에서 받은 키를 앱에 추가합니다. Google 계정이 필요합니다.

주의

reCAPTCHA v2, 즉 “I’m not a robot” Checkbox로 등록하세요. 이 연동은 해당 버전을 기준으로 만들어졌습니다. v3는 눈에 보이지 않게 작동하며 다른 종류의 키를 발급하므로, v3 키 쌍을 앱에 붙여 넣으면 양식에 확인 절차가 표시되지 않고 보호도 되지 않습니다. 버전은 등록할 때 Google에서 정해지므로, 나중에 알게 되기보다 등록 양식에서 정확히 선택하세요.

1단계 — Google에서 키 받기

1. reCAPTCHA 관리 콘솔 열기

   Google reCAPTCHA로 이동해 Google 계정으로 로그인합니다.

   앱 안에서도 이동할 수 있습니다. Google reCAPTCHA 페이지에 “Click here to create your own reCAPTCHA site key and secret key for your website”라는 문구가 있으며, here는 같은 콘솔로 연결되는 링크입니다.

2. 등록 양식 작성하기

   Google에서는 다섯 가지를 입력하라고 요청합니다. 그중 두 번째 항목이 전체 설정의 성패를 좌우합니다.

   필드	입력할 내용
   Label	1년 뒤에 다시 보더라도 어느 사이트의 키인지 알 수 있는 이름입니다. 스토어 이름이 가장 무난합니다.
   reCAPTCHA type	reCAPTCHA v2를 선택한 다음 그 아래의 "I'm not a robot" Checkbox 옵션을 선택하세요. v3나 보이지 않는 배지, Android 옵션은 선택하지 마세요.
   Domain	Shopify 스토어 도메인, 즉 견적 양식이 제공되는 주소입니다.
   Owners	그대로 두세요. Google이 로그인한 계정으로 설정합니다. 동료도 키를 관리해야 할 때만 주소를 더 추가하세요.
   Alerts	켜 두는 것이 좋습니다. reCAPTCHA 설정 오류나 의심스러운 트래픽 증가처럼 Google이 사이트에서 문제를 감지하면 소유자에게 이메일을 보냅니다. 첫 번째 경우가 바로 이 페이지에서 다루는 문제이므로, 고객이 알려 주기 전에 Google이 먼저 알려 주도록 하세요.

   모든 항목을 올바르게 입력한 다음 양식을 제출합니다.

3. 키 두 개 복사하기

   그러면 Google에서 site key와 secret key라는 키 쌍을 보여 줍니다. 곧 앱에서 같은 이름의 필드 두 곳에 각각 붙여 넣어야 하므로 이 페이지는 열어 두세요.

참고

등록하는 도메인은 고객이 견적 양식에 접근할 때 실제로 방문하는 도메인이어야 합니다. 두 도메인이 일치하지 않는 것이 확인 절차가 표시되지 않는 가장 흔한 원인입니다.

2단계 — 앱에 키 추가하기

1. 연동 설정 열기

   앱에서 Advanced settings로 이동해 Integrations 탭을 엽니다. Third-party integration 아래에서 Google reCAPTCHA를 찾아 엽니다. 연동마다 별도의 페이지가 있습니다.

2. 키 붙여 넣기

   페이지에는 위아래로 필드가 정확히 두 개 있습니다.

   앱의 필드	입력할 내용
   Site key	Google이 발급한 site key로, 키 쌍 중 공개되는 쪽입니다.
   Secret key	Google이 발급한 secret key로, 키 쌍 중 비공개인 쪽입니다. 다른 곳에 붙여 넣거나 팀 밖에 공유하지 마세요.

   Google에서 두 키에 붙인 이름이 앱과 같으므로 그대로 복사해 붙여 넣으면 됩니다. 두 키는 서로 바꿔 쓸 수 없으며, 서로 바꿔 붙여 넣는 실수가 가장 흔합니다. 둘 다 복사해 두고 기억에 의존하기보다 하나를 복사해 붙여 넣은 뒤 다른 하나를 복사하러 돌아가세요.

   

   

   Google에서 받은 키 두 개를 모두 붙여 넣고 저장하세요.

3. 저장하고 스토어프런트에서 결과 확인하기

   변경 사항을 저장한 다음, 고객이 하는 것처럼 스토어프런트에서 견적 양식을 엽니다. 양식에 “I’m not a robot” 체크박스가 표시되어야 합니다.

   실제 테스트 요청을 보내 보세요. 체크박스가 보이는 것은 site key가 작동한다는 것만 증명하며, 제출까지 완료되어야 secret key도 작동한다는 것이 확인됩니다.

참고

저장한 키는 페이지를 다시 열면 가려진 상태로 표시됩니다. 앱은 연동 키를 다시 보여 주지 않고 가려진 자리 표시자로 저장하기 때문이며, 정상적인 동작입니다. 키를 실제로 바꾸려는 경우에만 새 키를 붙여 넣으세요.

주의

이 키를 변경할 때마다 실제 제출로 테스트하세요. 잘못 설정된 확인 절차는 실제 고객을 조용히 차단할 수 있고, 도착하지 못한 요청은 눈에 보이지 않습니다.

확인 절차가 표시되지 않을 때

• v3가 아니라 v2로 등록했는지 확인하세요. v3 키 쌍에서는 체크박스가 표시되지 않습니다. v3는 원래 그런 방식입니다. Google reCAPTCHA 콘솔에서 사이트를 열고 등록된 유형을 확인하세요. v3로 되어 있다면 v2 “I’m not a robot” Checkbox 사이트를 새로 등록하고 두 키를 모두 교체하세요.
• 도메인이 일치하는지 확인하세요. Google에 등록한 도메인은 고객이 실제로 사용하는 도메인과 같아야 합니다.
• 두 키가 올바른 위치에 저장되었는지 확인하세요. 앱의 Site key 필드에는 Google의 site key를, Secret key 필드에는 Google의 secret key를 넣어야 합니다. 확실하지 않다면 Google에서 다시 복사해 붙여 넣고 저장하세요.
• 테마에서 앱이 켜져 있는지 확인하세요. 앱 대시보드의 Setup guide에 App embed is enabled 또는 App embed is disabled가 표시되며, Enable app embed 버튼이 있습니다.
• 필드가 잠겨 있지 않은지 확인하세요. 자물쇠 아이콘과 함께 “🔐 This feature is available on …“라는 문구가 표시되며 비활성화되어 있다면, 상위 요금제에 포함된 연동이라는 뜻입니다. 오류가 아니라 요금제 제한이므로 앱에서 Pricing plans를 여세요.

다음 단계

• 표준 양식 만들기 — 양식의 나머지 부분
• 연동 개요 — 견적 데이터를 다른 도구와 연결
• 파일 업로드 허용하기 — 앱에서 허용하는 파일 형식과 업로드에 사용되는 저장 용량