A Captcha számomra egy szóval jellemezhetó: FÁJDALOM, azonban szükségességét semmiképpen nem kérdőjelezném meg.
Gondoltam, milyen nagyszerű lenne egy olyan herkentyű, amely minden karakter begépelésekor azonnali visszajelzést küldene a form kitöltőkének, és nem csak a posztoláskor zúdulna a döbbenet.
Pár órányi szenvedést követően összeállt a rendszer, amely egy sima javascript, de szerintem és az eddigi tesztalanyok szerint is meglehetősen dögösre sikeredett.
Akkor hát következzék maga a form
<input name="seccode" type="text" id="seccode_id" size="20" onkeyup="count()" style="background-color:#FFFFFF"/>
<span id="ok"></span>
, amely majd a billentyű lenyomását követően fog értékelést kapni ettől az alábbi javascript kódtól.
<script type="text/javascript">
function count(){
var desc = document.getElementById("seccode_id").value;
var code = "<?php echo rtrim(preg_replace('/(.)/', '$1%51%', $_SESSION['secword']));?>";
var result = code.replace(/%51%/gi, "");
var length = desc.length;
if (desc.slice(0,length)==result.slice(0,length))
{document.getElementById("seccode_id").style.backgroundColor="#E2FFB1";
document.getElementById("ok").innerHTML = "";}
else
{document.getElementById("seccode_id").style.backgroundColor="#DF625B";
document.getElementById("ok").innerHTML = "the last charcter you entered is invalid";}
if (length==0){
document.getElementById("seccode_id").style.backgroundColor="#FFFFFF";
document.getElementById("ok").style.visibility="hidden";}
if (length==6 && desc.slice(0,length)==result.slice(0,length)){
new Fx.Style('secur', 'opacity', {duration:1000}).start(1,0);
document.getElementById("ok").style.visibility="hidden";}}
</script>
A javascriptnek két inputja van: a Captcha szkript által generált $_SESSION[‘secword’], valamint a humanoid szövegbevitel (input form tartalma). Az ellenőrző kód html-be történő kiíratását sajnos sehogy sem tudtam megkerülni, így annak szennyezéséről, majd megtisztításáról egy preg_replace php, majd egy replace js funkció gondoskodik, jelen szkriptben a Captcha karakterei közé egy %51% sztringet beszúrva.
A működés nagyon röviden a következő. Leütéskor a js megvizsgálja az input hosszát, majd az értéket a Captcha azonos hosszú értékével összeveti. Egyezés esetében az input háttérszíne zöldre vált, eltérés esetén piros féle árnyalatban tűndököl, valamint egy figyelmeztető szöveg is megjelenítésre kerül az ok id vel fémjelzett pozicióba, hogy azonnal felhívja a gépelő figyelmét a problémára.
Az utolsó három sor, már csak a hab a tortán. A demóban szereplő ellenőrzőkód 6 karakter hosszúságú, helyes begépelést követően a form container divje mootoolsosan beolvad a háttérbe.
További kellemes napot!
Szép, gratula. De a helyedben, hogy még szebb legyen átírnám unobtrusive javascript-re. http://en.wikipedia.org/wiki/Unobtrusive_JavaScript
Ez az unobstrusive javascript egy totál új dolog, köszönöm, utána fogok nézni.
Aranyos, de ez így pont a robotoktól nem véd 😉 De tényleg szép.
Örülök, hogy tetszik, már csak azt kellene megosztanod velem, hogy miért nem véd a robotoktól, ha a CAPTCHA értéke helyesen nem jelenik meg a forrásban. Kíváncsian várom válaszod 😉
Az ötlet jó, szebb megoldás viszont, ha AJAXot használva lekéred a szervertől a helyes kódot, így semmilyen formában nem jelenik meg a biztonsági kód a HTMLben. Egy másik megoldás, ahol ugyan megjelenik, de valamivel zavarosabb, ha enkriptálod valamilyen szimetrikus titkosítással, pl. DES … nem hiszem, hogy bármelyik robot is DESszel védett CAPTCHAkat keres 😀
És persze megint kirekesztik a vakokat és gyengénlátókat…
Miért nem terjed a “felolvasós” captcha??? 🙁
András, kérlek hidd el semmilyen kirekesztő szándék nem volt bennem, csak dögösíteni akartam az idegesítő captchát.
Nem rád gondoltam, hanem általában a Webmester társadalomra. A BMF-en nagyon sok gyengénlátó és vak tanul informatikát speciális képzésben, akik rendelkeznek ugyan “felolvasó” szoftverrel a gépükön, de sajnos nap mint nap látom, hogy rengeteg web oldal elérhetetlen számukra. Habár vannak kivételek, pl.: Google account regisztráció.
Legenerálja wav-ba szerintem. Tudom, hogy nem könnyű ezt leprogramozni, én nem is lennék rá képes, de örömmel venném ha valaki ezt megoldaná és elterjedne a weben.
Tisztelettel,
Tóth András
András, azt gondolom teljesen igazad van, de beszámolnék egy pár nappal ezelőtti tapasztalatomról. A digg.com-on küldtem be egy cikket és az érvényesítéshez természetes el kellett bánni egy captchával. Láttam mellette egy hangszóró ikont, tudtam ezzel meghallgathatom. Kattintottam, de a böngésző -ha jól emlékszem flash player hiányában- sikertelenül várt a bővítmény telepítésére. Semmilyen tapasztalatom nincsen a vakok és gyengénlátók internetezési szokásaival kapcsolatban, de nem vagyok benne biztos, hogy egy bővítmény telepítése könnyű feladat lenne számukra.
Magyarán van ahol van, de élni vele sem egyszerű.
A webmester társadalommal kapcsolatban pedig annyit írnék, azon túlmenve, hogy igazat adok neked abban, hogy az ilyen jellegű kirekesztés ellen tenni kell, bár ez inkább nem tudatos mulasztás, minden webmester a célcsoportjának készíti a honlapokat. Az igazán szörnyű az lenne, ha a gyengénlátóknak készült portálokon nem lenne hangos captcha, szerintem.
Hát ez így tényleg nem igazán véd a robotok ellen, mert a captchak-nak az lenne a lényegük hogy nem lehet a megfejtésükre programot (robotot) írni, ebben a scriptben meg ott van a megoldás a megfejtésre.
Elfogadom, amit írsz, he lekódolsz egy robotot, amelyik visszafejti a random szennyezést.
Jó munkát! 😉
Tegnap negyedórát szenvedtem egy ilyen vacakkal (de tényleg kb. annyit!), és nem azért mert rövidlátó vagyok, hanem mert a nyomorult nem akarta az igazságot. Meg kisnagybetűk vegyesen, amiből azt gondolnád, érzékeny rájuk, aztán csak csupakissel megy a dolog. :-/
Vak-témához annyit, hogy tényleg jó lenne, ha mindenkinek jó lenne, de pl. a gyengénlátókat akár ki is hagyhatod (esetleg a színvakok lehetnek olykor bajban?), én olyan rosszul látok, hogy hivatalosan vaknak minősülök, de a netezésben ez még nem zavart (legfeljebb akkor, amikor nem találtam a kijelentkezés-gombot a vipmail-en, mert a majmok elrejtették egyéb gomb alá, amire bökve 2 másodpercig volt látható pár másik felirat társaságában – de ez elég extrém eset, nem is tudok hasonlót), viszont van egy olyan oldala is a dolognak, hogyha elvárod, hogy egy ember kényelméért ötszáz válllaljon kényelmetlenséget, azzal előbb-utóbb annak az egynek is rosszat teszel, mert legszívesebben megfojtanák majd (jogosan). Az érintettek a legtöbbször nagyon nem kérnek az ügyük túllihegéséből.
Zerge
Szia Zoli,
El szomorítsalak:
Üsd be kérlek FireBugba:
var str = count.toString();
var arr = str.split(‘\n’);
eval( arr[2] );
var codeARR = code.split( ‘%51%’ )
theCode = ”;
for( i=0;i
Kow, mindig tudtam, hogy te egy ügyes designer vagy.
Akkor én is mutatok egyet, ami még látványos is és nem a függvényt “belezi ki”:
var input = document.getElementById(“seccode_id”);
var code=””;
for(i=0;i
hát a kissebb jelet ne szereti a komment megpróbálom <-vel
var input = document.getElementById(“seccode_id”);
var code=””;
for(i=0;i<6;i++){
var chr=40
while(input.style.backgroundColor!=”rgb(226, 255, 177)” && chr<200){
chr++
input.value=code+String.fromCharCode(chr)
count()
input.value=””
}
code+=String.fromCharCode(chr)
count()
}
input.value=code
Ha egy kicsit belegondoltok, egyáltalán nincs is szükség a CAPTCHA-ra.
Miről szól a játék? Arről, hogy a botok ne tudjanak automatikusan bejegyzéseket küldeni. Ha ezt megoldod, akkor nem kell a júzereket kínlasztani.
Pedig erre a megoldás annyira egyszerű!
–> Adj meg egy kanyi “action”-t a formodnak, amit javascripttel felülírsz
var cel1=”act”
var cel2=”ion”
var ext=”php”
id=”submit”+’form’
document.getElementById(id).action=cel1+cel2+’.’+ext
Ennyi már bőven elég, de a javascript kódot lehet az égig bonyolítani.
acsudába… a blog kiszedte HTML tagokat 🙁
Mégegyszer, hátha megmarad a lényeg is
(FORM action=”suck_bot.php” id=”submitform”)
(INPUT ….
(/FORM)
(SCRIPT)
var cel1=”act”
var cel2=”ion”
var ext=”php”
id=”submit”+”form”
document.getElementById(id).action=cel1+cel2+”.”+ext
(/SCRIPT)
Szia Ashtor!
Azt hiszem te a zseni kategóriába tartozol, vagy csak nagyon jó oldalakat olvasol. Megtesztelem a módszered, remélem robot biztos 🙂
Köszönöm
Sziasztok!
Csak részben értem, amit írtok, ezért kicsit félve kérdezem meg: mit gondoltok a számolós captcha-ról? Úgy hiszem, azt fel tudja olvasni a vakoknak is, nem kell guvasztani hozzá a szemed sem, nincs benne semmi trükk (kisbetű/nagybetű pl.), csak beírod, hogy 2+3=? 5, és kész. Nyilván lehet rá robotot programozni – szoktak?
Most látom, neked is ilyesmi van 🙂
A Captcha egy elég hasznos, de ezen felül is van módja hogy a látogatóinkat ne terheljük feleslegesen. Ezen felül sok mindenki nem érti mit kell csinálni.
Használjatok javascript formot, magyarul nem lessz benne a forrás kódba a form így a robotok sem fognak mindenfélét beregelni.
Tedd bele az egész formot scriptbe ( külön file-ba, és id vel hívd meg.
Hatékony megoldás.
@Julia
a szamolos captcha-t gyerekjatek feltorni, esetleg ha kepen rakod ki a szamot akkor okoz egy kis nehezseget
Zoltán!
Ashtor módszerét letesztelted? Mi lett az eredménye?
Nagy Sanyi hozzászólását egy cikkben nem tudnánk megvitatni? Érdekelenének a kacsát kiváltó / kiegészítő alternatív megoldások.