środa, 20 maja 2015

O tym jak boty uprzykrzają życie i gotowych rozwiązaniach - angular + recaptcha.

Będąc szczęśliwym człowiekiem w projekcie który realizujemy zrobiłem zaczyn rejestracji, który na moje nieszczęście nie posiadał żadnej weryfikacji antybotowej. Po deploymencie na nasz serwer symulujący serwer produkcyjny po dniach dwóch napisał do mnie kolega, że aplikacja wali 500. Szybka analiza wykazała, że w bazie jest milion użytkowników (ach ten sukces komercyjny), a ponieważ w aktualnej wersji żadnego stronicowania nie było, to oczywiście mieliśmy zawieche na bazie. Rozwiązanie jest zapewne wszystkim dobrze znane - mechanizm captchy tzn. obrazka, który jest dla komputera nieanalizowalny (w rozsądnym czasie), więc aby go przejść trzeba być człowiekiem. Oczywiście gotowe machanizmy istnieją i jednym z nich jest reCaptcha od wujka google, która w wersjach tradycyjnych stron sprowadza się do wygenerowania pary kluczy u googla, dodania jednego diva zawierającego informacje o kluczu publicznym i dołączenia odpowiedniego java-skryptu, który przy wysyłaniu formularza "dołączy" status captchy, gdzie później w naszej aplikacji sprawdzimy status łącząc się do serwera googla (na wejściu dostarczamy wartość formularza, na wyjściu otrzymujemy status weryfikacji). Realizacja wg. koncepcji angulara oczywiście w tak prosty sposób działać nie będzie i trzeba to jakoś połączyć (oczywiście realizacja serwerowa jest taka sama), ponaglany czasem, strachem przed światem oraz wychodząc z założenia, że wyważać otwartych drzwi nie będę, skorzystałem z gotowego rozwiązania jakim jest https://github.com/VividCortex/angular-recaptcha, które to rozwiązanie dostępne jest również w pakietach Bower oraz npm. Sam sposób użycia jest dokładnie opisany w przykładzie pod podanych linkiem (nie polecam wymyślać tego na nowo, tylko zrobić tak jak opisał to autor), natomiast implementacje połączenia z serwerami googla, łatwo znaleźć w dokumentacji recaptchy. A na koniec obrazek efektu:

Brak komentarzy:

Prześlij komentarz