Vážení čtenáři, vítám vás v šestém díle seriálu o JavaScriptu. V tomto díle popíšu, jak může JavaScript poznat, odkud pochází, a také, co se s tím dá dělat za triky a kouzla.

Pro to, aby JavaScript mohl zjistit informace o tom odkud pochází webovská stránka, ze které byl spuštěn, existuje objekt location. V tomto objektu je uvedeno vše potřebné, abyste si mohli položit otázku z nadpisu článku: "Kdo jsem já?" Asi nejjednodušší použití je prosté zjištění internetové adresy, odkud stránka pochází. Používá se k tomu vlastnost href objektu location. Uvedu příklad zápisu stránky, která vám umožňuje zjistit tuto informaci:

<html>
<head>
<title>Kdo jsem já?</title>
</head>
<body>
<a href="javascript:void alert(self.location.href);">Kdo jsem já?</a>
</body>
</html>

A pokud kliknete na následující odkaz s nápisem "Kdo jsem já?", tak uvidíte, jak to dopadne:

Kdo jsem já?

Vše je zatím celkem jednoduché, po kliknutí na odkaz se otevře okno pomocí příkazu alert. Do tohoto okna se vypíše adresa naší stránky. Začneme tak, že použijeme instanci self, která přestavuje okno prohlížeče, ve kterém se teď nacházíme. Pomocí self.location získáme objekt location, který nám umožňuje číst informace o našem umístění na internetu. A konečně pomocí vlastnosti href zjistíte, na jaké adrese naše stránky leží.

Daleko zajímavější je možnost nejenom zjistit, z jaké internetové adresy pocházíme, ale dokonce se můžeme pomocí objektu location přenést na jinou stránku. V minulých dílech jsem prováděl načtení stránky v jiném okně, pomocí objektu location je možné se přesunout na novou stránku bez otevírání nového okna. To se dá snadno využít v případě, pokud si své stránky přestěhujeme někam jinam. Potom na staré adrese necháte jenom tuto HTML stránku a návštěvníci budou automaticky přeneseni na novou adresu:

<html>
<head>
<title>Stránky byly přesunuty</title>
</head>
<body>
<h2>Tyto stránky byly přesunuty na adresu
  <a href="www.interval.cz">www.interval.cz</a>
</h2>
<script type="text/javascript" language="JavaScript"><!–
  self.location.href="www.interval.cz;"
// –>
</script>
</body>
</html>

Výše uvedený příklad pracuje tak, že přesměruje stránky na adresu www.interval.cz. Provádí to automaticky tím, že nastaví novou adresu do vlastnosti href objektu location. Používá se zápis, kdy za self.location.href napíšete rovnítko a přímo adresu, kam se chcete přesunout. Sami si můžete vyzkoušet, že pokud tento příklad spustíte odkudkoliv, vždycky nakonec natáhne www.interval.cz. Tento příklad je plně funkční a můžete jej použít, pokud se budete stěhovat se svými webovými stránkami. Musíte jenom všechny texty www.interval.cz nahradit adresou svých nových stránek. Umožníte tak vašim stálým návštěvníkům, aby vás nemuseli hledat.

Přesměrování vám umožňuje více možností, například se používá pro velmi jednoduché zabezpečení stránek heslem. Bezpečnost sice není moc vysoká, ale funguje to. Princip je v tom, že máte tajnou stránku, která je jako jediná umístěna v určitém podadresáři, například trezor. Vlastní tajnou stránku si nazvete třeba bumerang.html. Nikde ve stránkách na ní nemáte odkaz, ale vaše úvodní stránka v sobě obsahuje následující kód:

<html>
<head>
<title>Zadejte heslo</title>
</head>
<body>
<h2>Po zadání hesla se dostanete na tajnou stránku</h2>
<form name="f">
<input type="text" name="heslo" value="">
<input type="button" value="Přejít na tajnou stránku"
  onClick="self.location.href=‘./trezor/’+self.document.f.heslo.value+‘.html‘;">
</form>
</body>
</html>

Celé to vypadá takto (heslo je bumerang):

Pokud použijete tento příklad na svých stránkách, potom pokud zadáte správné heslo, přesunete se na tajnou stránku, jinak vypíše prohlížeč chybu, že stránka neexistuje. A jak to pracuje? Po kliknutí na tlačítko se "probudí" kód v JavaScriptu, který je zapsán v atributu onClick. Tento kód pracuje tak, že nejdříve složí dohromady adresu tajné stránky. Při tom všem se používá operace sčítání (znak +), která spojí jednotlivé texty dohromady. Takže najdříve se použije text ./trezor/, k tomu se připojí obsah textového pole (to se zjistí pomocí zápisu self.document.f.heslo.value, podrobné vysvětlení viz. minulý díl seriálu o JavaScriptu a formulářích). A za to všechno se ještě připojí .html jako ukončení. Takže pokud zadáte třeba ahoj, potom JavaScript vám složí adresu ./trezor/ahoj.html. Pokud zadáte správně bumerang, JavaScript vám složí ./trezor/bumerang.html. Je jasné, že stránku ahoj.html nenajde, protože žádná taková v podadresáři trezor není. Ale stránku bumerang.html najde a zobrazí. Podstatné je, že heslo není nikde zapsáno, a kdo ho nezná, na stránku se těžko dostává.

V tomto díle jsem popsal nejpoužívanější část objektu location. Objekt location toho umí více, a později se k němu ještě vrátím. Takže to je pro tento díl vše.

Starší komentáře ke článku

Pokud máte zájem o starší komentáře k tomuto článku, naleznete je zde.

Žádný příspěvek v diskuzi

Odpovědět