Pod koniec kwietnia pojawiły się ataki na sklepy Prestashop rejestrujące nowe fikcyjne konta użytkowników.
Konta te są zakładane przez boty w celu rozsyłania spamu. Po założeniu konta ze sklepu jest wysyłany powitalny mail do klienta z potwierdzeniem założenia konta.
Boty zamiast nazwiska podają link do strony i w ten sposób „przemycają” link wysyłając go w powitalnej wiadomości do końcowych użytkowników.
Jednym ze sposóbów na zabezpieczenie przed rejestracją fałszywych kont w Prestashop jest wdrożenie reCaptcha google, który trzeba zaznaczyć przed założeniem konta.
W celu wdrożenia tego rozwiązania niezbędę jest zarejestrowanie strony na której będzie reCaptcha. Można to zrobić pod adresem https://www.google.com/recaptcha/intro/v3.html
Po zarejestrowaniu konta otrzymujemy klucz do witryny którym będziemy się posługiwali przy wdrożeniu reCaptcha.
Do wdrożenia będziemy potrzebowali zmodyfikować 2 pliki
header.tpl – który znajduje się w public_html/themes/default-bootstrap
W tym pliku musimy zainicjować skrypt js google wystarczy wkleić:
między początkiem nagłówka strony a końcem w html oznaczone jako <head> (początek) </head> (koniec)
W kolejnym kroku musimy do fomularza rejestracji dodać div, który będzie odpowiedzialny za wyświetlanie reCaptcha.
Formularz rejestracji znajduje się w pliku authentication.tpl
Dostępny w tym samym folderze co plik header.tpl
public_html/themes/default-bootstrap
Jeśli dysponujesz standadowym szablonem rejstracji w linii 64 po
<div class="submit">
wklej div wyświetlający reCaptha.
<div class="g-recaptcha" data-callback="recaptcha_callback" data-sitekey="T W Ó J K L U C Z S TR O N Y"></div>
(patrz rys pkt a)
W tym formularzu dostępne są 2 przyciski, które mogą wykonać formularz – nie wiem na którym bot działa dlatego zabezpieczymy oba.
W pierwszym button jest jasno określony przez id=”SubmitCreate”. Drugi ukryty <input type=”submit” już nie. Wystarczy nadać mu nazwę id np: id=”SubmitCreateInput” (na rys. pkt b).
Obydwa guziki musimy wyłączyć – będą włączane dopiero po zanaczeniu reCpatha.
W tym celu trzeba dodać do jednego i drugiego disabled=”disabled” (na rysunku pkt c).
Na końcu rozmularza wklejamy kod, który włączy nam guzik rejestracji użytkownika w Prestashop po prawidłowej weryfikacji reCaptha.
<script type="text/javascript">
function recaptcha_callback() {
$('#SubmitCreate').removeAttr('disabled');
$('#SubmitCreateInput').removeAttr('disabled');
};
</script>
Całość powinna wyglądać jak na rysunku poniżej.
Efekt końcowy powinien być taki jak na filmie.
W przypadku problemów, prosimy o kontakt.