reCAPTCHA 필드 삽입

양식에 reCAPTCHA 필드를 추가하는 방법을 알아보세요.

reCAPTCHA는 스팸 및 오용으로부터 양식 제출을 보호하는 데 도움이 되는 Google의 서비스입니다. 이 서비스는 실제 사용자만 귀하의 사이트에 양식을 제출하도록 설계되었습니다. 양식에서 reCAPTCHA를 활용하는 방법에 대해 자세히 알아보세요.

이 교육 세션에서는 다음을 이해하게 됩니다.

  1. 양식에 reCAPTCHA를 포함하는 방법
  2. 사이트에 대한 reCAPTCHA 확인을 활성화하는 방법
  3. reCAPTCHA를 조정하는 기술

중대한: 양식 제출을 컴파일하기 위해 사용자 지정 양식 작업을 지정한 경우 reCAPTCHA가 작동하지 않습니다.

중대한: reCAPTCHA를 활용하는 Webflow 양식은 내보낸 사이트에서 작동하지 않습니다. 사이트를 내보낼 계획이라면 양식에 따라 reCAPTCHA를 연결해야 합니다. Google의 reCAPTCHA 가이드. 또한 내보낸 사이트에서 양식 제출을 수집하는 방법에 대해 알아보세요.

양식에 reCAPTCHA를 포함하는 방법

다음에서 양식에 reCAPTCHA를 첨부할 수 있습니다. 패널 추가 > 강요 섹션 > 양식 영역. reCAPTCHA 요소를 양식에 삽입해야 합니다.

중대한: reCAPTCHA는 사이트 설정 > 양식 섹션에서 유효성 검사를 활성화할 때까지 라이브 사이트에 표시되지 않습니다. 이를 통해 전체에서 reCAPTCHA 유효성 검사가 가능하다는 점을 인식하는 것이 중요합니다. 모두 양식을 사이트에 추가하려면 모든 양식에 reCAPTCHA 요소를 포함해야 합니다.

유용한 힌트: reCAPTCHA는 사이트 방문자의 언어를 자동으로 감지하고 해당 언어로 위젯을 표시합니다.
reCAPTCHA 아이콘은 추가 패널의 양식 섹션에서 강조 표시됩니다.

사이트에 대한 reCAPTCHA 확인을 활성화하는 방법

다음 단계에 따라 사이트에서 reCAPTCHA를 구성할 수 있습니다.

  1. 사이트 등록 및 API 키 생성
  2. reCAPTCHA 확인 켜기

사이트 등록 및 API 키 생성

  1. 향하다 Google의 reCAPTCHA 페이지
  2. 선택 reCAPTCHA 유형: reCAPTCHA v2
  3. 선택하세요 “나는 로봇이 아닙니다” Checkbox

그런 다음 아래에 입력하여 사이트에 연결된 모든 도메인을 등록하십시오. 도메인. 등록하고 나면 reCAPTCHA 설정에 2개의 API 키(사이트 키와 비밀 키)가 제공됩니다. 이 키는 다음 단계에서 reCAPTCHA 확인을 활성화할 때 사용됩니다.

메모: 사용 중인 맞춤 도메인(예: “example.com”)을 추가했는지 확인하세요. 게시, 준비 또는 테스트를 위해 하위 도메인을 사용하는 경우 “example.webflow.io”(하위 도메인으로 “example” 대체)를 통합할 수도 있습니다. 사용자 정의 도메인의 하위 도메인은 자동으로 등록됩니다. 이는 “example.com”에 대한 등록이 “subdomain.example.com”도 등록한다는 의미입니다. Google reCAPTCHA의 도메인 이름 인증에 대해 자세히 알아보세요..

중대한: 도메인 등록이 적용되기까지 최대 30분이 걸릴 수 있습니다.

reCAPTCHA 확인 켜기

중대한:사이트에서 reCAPTCHA를 활성화하기 전에, reCAPTCHA를 활성화하면 다음에 대한 유효성 검사가 시행된다는 점을 기억하세요. 모두 귀하의 사이트에 있는 양식. reCAPTCHA 요소가 없는 모든 양식은 제출에 실패하다. 이 조정이 이루어집니다. 사이트 재게시 여부에 관계없이 저장을 클릭한 후(아래 4단계) reCAPTCHA를 활성화하기 전에 각 양식에 reCAPTCHA 요소를 추가해야 합니다.

사이트에서 reCAPTCHA 확인을 활성화하려면 다음 안내를 따르세요.

  1. 로 이동 사이트 설정 > 양식 섹션 > reCAPTCHA 검증
  2. Google에서 API 키를 삽입합니다( reCAPTCHA v2사이트 키 그리고 reCAPTCHA v2 비밀 키) - 관련 필드에
  3. reCAPTCHA 인증 활성화
  4. 구하다 당신의 조정
  5. 게시 귀하의 사이트

중대한: 보호 및 적절한 기능을 위해 비밀키 에서 사이트 키 필드.

메모: 계속해서 디자인하고 싶거나 라이브 사이트의 모든 양식에 대해 reCAPTCHA를 활성화할 준비가 되지 않은 경우 나중에 사이트 설정으로 돌아가서 활성화할 수 있습니다.

reCAPTCHA 필드를 추가한 후 게시된 사이트에서 양식이 올바르게 작동하는지 확인하는 것이 좋습니다.

자주 묻는 질문(FAQ) 및 해결 방법

reCAPTCHA 관련 문제가 발생하는 경우 잠재적인 문제, 경고, 오류 메시지 및 문제 해결 방법은 다음과 같습니다.

게시된 사이트에서 reCAPTCHA 요소를 관찰할 수 없습니다.

reCAPTCHA 확인을 활성화했는지, 양식에 reCAPTCHA 요소를 포함했는지, 사이트를 다시 게시했는지 확인하세요.

귀하의 웹페이지

  • 캐시를 지운 다음 다른 테스트를 수행해 보세요.
  • reCAPTCHA 구성 요소에 "사이트 소유자 오류: 사이트 키에 대한 도메인이 잘못되었습니다."라는 메시지가 표시될 수 있습니다.
    유용한 힌트: 캐시를 지워도 문제가 해결되지 않으면 시크릿 창에서 테스트해 보세요. reCAPTCHA가 오류 없이 올바르게 표시되면 이 작업을 통해 reCAPTCHA 구성에 대한 캐시가 새로 고쳐져야 합니다. 이제 reCAPTCHA는 모든 탐색 세션에서 예상대로 작동해야 합니다. 문제가 지속되면 API 키( reCAPTCHA v2 사이트 키 그리고 reCAPTCHA v2 비밀 키) 새 항목을 생성합니다. 그런 다음 두 키를 모두 업데이트하십시오. 사이트 설정. 사이트 키와 비밀 키는 대소문자를 구분합니다.

    reCAPTCHA를 개인화하는 방법

    reCAPTCHA는 제한된 사용자 정의 옵션을 제공하지만 사용자 정의 속성을 사용하여 개인화할 수 있습니다. 사용자 정의 속성을 통해 적용된 스타일은 실제 사이트에만 반영된다는 점에 유의하세요.

    reCAPTCHA의 색 구성표 수정

    기본적으로 reCAPTCHA 구성요소는 회색 배경과 검은색 텍스트가 있는 밝은 테마로 제공됩니다. 검정색 배경에 흰색 텍스트가 있는 어두운 테마로 전환할 수 있는 옵션이 있습니다. 어두운 테마를 활성화하려면:

    1. 다음을 선택하세요. 리캡차 캔버스의 구성 요소
    2. 로 이동 요소 설정 > 맞춤 속성
    3. “를 클릭하세요....을 더한" 아이콘
    4. 'data-theme'을 입력하세요. 이름 필드
    5. "dark"를 입력하세요. 필드
    양식 내 강조된 어두운 테마 reCAPTCHA입니다.

    reCAPTCHA 크기 변경

    reCAPTCHA 요소는 미리 정의된 크기와 함께 제공됩니다. 사용자 정의 속성을 추가하여 더 압축할 수 있습니다.

    reCAPTCHA 구성요소의 크기를 줄이려면 다음 안내를 따르세요.

    1. 선택 리캡차 캔버스의 요소
    2. 입장 요소 설정 > 맞춤 속성
    3. “를 탭하세요....을 더한" 아이콘
    4. 에 "데이터 크기"를 삽입하십시오. 이름 필드
    5. 입력란에 "compact"를 입력하세요. 필드
    양식 내의 강조된 압축 reCAPTCHA 요소입니다.
    이완 막
    Ewan Mak의 최신 게시물 (모두 보기)