un captcha.... pure javascript
Sâm Ian 02, 2010 3:25 am
0De cand "mi-am deschis" un al doilea blog, pe platforma wordpress am inceput sa ma confrunt cu problema spamului - problema pe care nu o aveam cand scriam numai pe blogul de aici, de pe programare.org.
Nu ca as avea eu multi cititori acolo, insa din aia 3 care sunt, 4 trimit comentarii spam - acele comentarii enervante, probabil postate de un program, alese in mod random dintr-un set de comentarii, care tot ce fac e sa isi puna un link spre un site de medicamente, gambling sau alte "kestii etice"! Asa ca azi, neavand kef de munca la munca, m-am apucat sa scriu cateva linii javascript care sa joace un rol de captcha.
Rezultatul se poate vedea si test pe blogul meu secundar (sau principal, ca nu m-am hotarat inca cum e cu ordinea si prioritatile). In orice postare pe blog la comentarii e un mic (si simplu) captcha. Chiar as fi recunoscator sa primesc un feed back - in cazul in care cineva gaseste vre-o erroare in functionarea lui.
Asa... vorba multa plictiseste. Sa trecem la cod. Cum am facut:
Am pus 2 numere, generate random, si in momentul in care se apasa butonul de posteaza un comentariu se verifica daca userul a introdus suma acelor doua numere. Daca suma introdusa e incorecta, comentariul nu este trmis. Simplu, insa ar trebui sa fie eficient impotriva robotilor si postacilor indieni, care s-ar putea sa nu priceapa romana, deci sa nu inteleaga ce vreau eu de la ei.
Tot codul html care trebuie introduc in pagina (undeva in preajma butonului de submit) e asta:
| Cod: |
| <span id="frst"></span> + <span id="sec"></span> = <input id="response" type="text" style="width:30px;" /><p style="color: red;" id="sumError">verificare antispam nereusita. Main incearca odata!</p> |
Apoi... in partea de final a paginii urmatorul cod javascript:
| Cod: |
|
<script language="JavaScript"> <!-- function generateInt(max){ return Math.floor(Math.random()*max) } function setText(elemId, str){ var elem = document.getElementById(elemId); if(elem){ if(elem.textContent != null) elem.textContent = str; else elem.innerText = str; } } function getText(elemId){ var elem = document.getElementById(elemId); if(elem){ if(elem.textContent != null) return elem.textContent; else return elem.innerText; } } function checkSum(){ if(frst === null || sec === null) { //return. ceva nu a functionat in script si numerele nu au fost afisate/generate return; } var result = document.getElementById("response").value; if(result != frst + sec) {setText("sumError", "verificare antispam nereusita. Main incearca odata!"); return false; } else { return true; }; } var frst = generateInt(9); var sec = generateInt(9); setText("frst", frst); setText("sec", sec); //--> </script> |
Sunt sigur ca scriptul poate fi imbunatatit, insa ceea ce am vrut sa fac e un script simplu (fara sa pierd prea mult timp sa-l scriu). FeedBack-ul este binevenit.
Pentru cei care vor sa foloseasca acest script in paginile lor... liber. Ar fi apreciat un link spre programare romaneasca | blog zeltera sau zeltera.blog | blog programare
Later edit:
Dupa remarca lui Birkoff (primul comentariu) am corectat un pic scriptul. Am scos atributul action din elementul <form>, a.i. un script automat sa nu poata sa citeasca pagina unde trebuie trimis comentariul. Acum elementul form arata asa: <form action="" method="post" id="commentform">
Am introdus in cod o noua variabila in care salvez url-ul spre care se trimit datele: <script language="JavaScript">var formUrl= "<?php echo get_option('siteurl'); ?>/wp-comments-post.php"; </script>.
In functia checkSum() am modificat codul, astfel incat, in cazul in care suma este corecta, elementului form i se seteaza atributul action la valoarea salvata in variabila formUrl.
In cazul dat, chiar trebuie apasat butonul ala! O singura scapare... pana acum, daca scriptul de autosubmit foloseste direct url-ul unde trebuie trimis comentariul (pe platforma wordpress e default wp-comments-post.php), solutia de mai sus nu mai functioneaza, si trebuie introdusa o variabila suplimentara.
O sa astept 2-3 zile sa vad daca mai scap de spam, si daca nu o sa continui sa imbunatatesc scriptul pana cand o sa scap (sau macar reduc semnificativ) spamul.
| Cod: |
| function checkSum(){
if(frst === null || sec === null) { //return. ceva nu a functionat in script si numerele nu au fost afisate/generate return; } var result = document.getElementById("response").value; if(result != frst + sec) {setText("sumError", "verificare antispam nereusita. Main incearca odata!"); return false; } else { document.getElementById("commentform").action=formUrl; return true; }; } |
) ar fi o fereastra