Naštěstí rok 2020 přinesl kromě lockdownu i změnu ve fungování prohlížečů. Stejnou situaci, tedy přetažení obrázků do okna prohlížeče na stránku nyní řeší prohlížeče otevřením v novém okně. Tedy už netřeba scriptu který přesně tohle udělá.
To ale není konec, že?
Nope… samozřejmě. Je tu další podobný kandidát, tentokrát řešící problém s formuláři. Totiž prohlížeče mají ve výchozím stavu našeptávání formulářů. Podle mě asi největší mor dnešní doby, čítá to takových problémů. Na jeden se hned podíváme.
Tak rovnou k podstatě problému
Claim: Uživatel se přihlašuje, napíše jméno heslo, odpálí to enterem. Přihlášení je úspěšné, prohlížeč vybídne uživatele k uložení přihlašovacích údajů. Uživatel je uloží a při příštím pokusu o přihlášení je už prohlížeč předepíše do přihlašovacího formuláře… jenže přihlášení nefunguje. V prohlížeči uložené přihlašovací údaje jsou chybné.
Jak je to vůbec možné, vždyť výzvu k uložení přihlašovacích údajů prohlížeč zobrazí teprve po úspěšném přihlášení
Navíc tohle se mi nikdy nestalo! To musí být nějaká blbostProblém je to trochu atomický, ne skutečně atomický, ale v tom smyslu, že se stane se v 1 z mnoha set pokusů a o to hůře se pak přichází na to kdy a co a proč.
Jde o situaci, kdy uživatel napíše jméno/heslo začne odesílání formuláře jenže pak napíše ještě byť jen jediný znak.
Ten krátký čas mezi začátkem odeslání formuláře a dokončením odeslání formuláře (jak bývá dobrým zvykem po POST požadavku … načtení jiné stránky) stačí na to aby se stal průšvih.
Chrome uživateli uloží i ty chybné hodnoty napsané po odeslání formuláře. Na server dorazí jméno a heslo správné, uloží se špatné doplněné o znaky napsané po odeslání formuláře. Pokud uživatel píše rychle a používá enter, může se mu stát že přesně do tohoto stavu se dopracuje.
Majitel webu by s tím samozřejmě mohl něco dělat… po odeslání formuláře ho nastavit celý readonly. Což vás postaví před další problémy, typicky pomalý server nebo pomalé internetové připojení uživatele a občasná potřeba odeslat formulář znovu.
Ale od čeho jsou problémy? Přece aby se řešily.
Pojďme tohle tvrzení dokázat
Tak příklad v praxi na … Wikipedii
Malý kousek kódu to snadno prokáže. A vyzkoušíme to na nějakém webu, který zná každý a budu rád jestli tam má každý i účet (nemá, ale je to škoda :) ). Wikipedie, tam se můžete přihlásit (do české verze) na nehezké URL adrese : https://cs.wikipedia.org/w/index.php?title=Speciální:Přihlásit . A tam spusťte tento kousek kódu:
(()=>{
const form = document.querySelector('form[name="userlogin"]');
form.elements['wpName'].value='mojeUživatelskéJméno';
form.elements['wpPassword'].value='mojeHeslo';
form.submit();
form.elements['wpName'].value='cizíUživatelskéJméno';
})();
(Článek je určen pro alespoň mírně pokročilé uživatel, kde předpokládám že dokáže spustit script, změnit přihlašovací údaje z ukázkových na vlastní a že ji povšimnou toho že tento script neunáší jméno a heslo někam jinam. Uživatelům co se v javascriptu nevyznají bych nikdy nedoporučoval spouště na stránce nějaké scripty kterým nerozumí. To je průšvih, dá se tak přijít o účet.)
Jak vidíte script vyplní jméno a heslo a odešle formulář a poté hned změní hodnotu uživatelského jména na jiné. Co vám nabídne k uložení prohlížeč? Nabídne hodnotu vloženou po odeslání formuláře, ovšem na Wiki se přihlásíte s hodnotou před odesláním. Ops.
Takže zamykat formuláře, udělal někdo už nějaký script co to zařídí?
To netuším, zatím to nechám na každém programátorovi a jeho možnostech a schopnostech, pokud bude zájem jednou něco drobného spíchnu.
A závěrem ještě trochu pomluvit automatické ukládání a vyplňování formulářů
Totiž necháváte uživatele na nějaké stránce, třeba jejich profilu spouštět javascript? Však o nic nejde, je to jen jedna stránka a přihlašování je na samostatné jiné stránce, tak se nic nemůže stát. No to je velká chyba. Je to obrovský průšvih na jakékoliv stránce a může snadno vést k odcizení přihlašovacích údajů všech uživatelů. Prohlížeč totiž přihlašovací údaje vyzradí automaticky a kterékoliv stránce z dané domény. Demonstrovat a osobně vyzkoušet tento problém lze na https://senglehardt.com/demo/no_boundaries/loginmanager/index.html. Do stránky napíšete libovolné přihlašovací údaje, ideálně falešné, stránka přijme cokoliv a prohlížeč vás klasicky vyzve k uložení. Pokud je uložíte následující jiná stránka je může přečíst… bez přihlašovacího formuláře samotného a zcela automaticky.