Contact Form 7에 ReCaptcha v2 적용으로 스팸 메일 방지하기



Contact Form 7은 워드프레스에서 연락받기 기능으로 간단하게 많이 쓰이는 플러그인입니다. 이 홈페이지에도 문의하기 양식을 Contact Form 7으로 받고 있는데요.

다만 스팸 메일을 분류하지 못한다는 단점이 있습니다. 신기하게도, 워드프레스 홈페이지는 조금만 트래픽이 쌓이면 어떻게 알았는지 외국인들로부터 수많은 스팸 메일을 받게 됩니다.

처음에는 'I'm not a robot'이라는 체크박스를 만들어서 해당 체크박스를 누르지 않으면 문의 사항을 보낼 수 없도록 해놨었습니다. 구글 ReCaptcha 같은 스크립트 요소를 최소한으로 빼서 홈페이지 속도를 빠르게 하려고 했었는데요. 그만큼 스팸 메일을 막기엔 역부족이었던 것 같습니다.

(만약 체크박스만 사용하고 싶다면 Contact Form 7에서 [checkbox* checkbox-176 use_label_element exclusive "I'm not a robot"] 를 넣어주면 됩니다.)

ReCaptcha v2 적용하기

보다 엄격한 보안 조치를 위해서라면 ReCaptcha를 사용할 수 있습니다. 흔히 로그인할 때 '로봇이 아닙니다' 버튼이나, 9개의 그림 중 신호등이 들어가 있는 사진을 선택하게 한다든지의 검사를 제출하게 해서 로봇을 가려내는 방법이 리캡챠(ReChaptcha) 입니다.

워드프레스에서는 플러그인을 이용해 Contact Form 7에 리캡챠 기능을 넣을 수 있습니다. 참고로 현재 리캡챠의 최신버전은 v3지만, 자동으로 봇을 인식해주는 것에 한계도 있고 워드프레스와 호환이 맞지 않는 경우도 있어 v2 버전을 사용했습니다.

우선 ReCaptcha v2 for Contact Form 7 이라는 플러그인을 다운받아 활성화시켜줍니다.

플러그인이 설치되면 '연락처' (Contact Form 7의 한국어 메뉴 이름입니다) 메뉴 내부에 'reCapthca Version'이라는 항목이 만들어집니다. 여기서 Select reCaptcha Usage를 'reCapthca Version 2'로 바꾸고 Submit을 누릅니다.

이제 연락처 양식에서 만들었던 내 양식에 reCaptcha라는 칸이 있는 것을 볼 수 있습니다.

구글 리캡챠에 사이트 등록하기

하지만 지금은 구글 API 설정이 안 되어 있어서 사용할 수 없습니다. https://www.google.com/recaptcha/admin/create 주소에 들어가 내 홈페이지에 리캡챠를 등록해야합니다.

라벨에는 알아보기 쉽게 홈페이지 주소를 입력합니다. reCAPTCHA유형은 v2를 선택하고 '로봇이 아닙니다' 체크박스를 사용하기로 합시다. 도메인에는 리캡챠를 적용할 정확한 홈페이지 주소를 입력하고 서비스 약관 동의까지 해서 제출하면 됩니다.

아래와 같이 사이트 키와 비밀 키가 만들어졌는데요. 이 키는 복사해서 워드프레스 대시보드의 연락처 > 통합 > 리캡챠 부분에 입력해줘야합니다.

연락처 > 통합 > 리캡챠
사이트 키와 비밀 키를 입력하고 변경 사항 저장을 누른다

정상적으로 리캡챠가 활성화되면 연락처 양식에 reCaptcha 버튼을 눌러 리캡챠 확인칸을 만들 수 있습니다. [recaptcha] 라는 숏코드로 사용할 수 있습니다.