Jednoduchý zkracovač URL adres

Ahoj!

Fakt dlouho jsem tady nic nenapsal a celkem je mi to líto. Poslední dobou na to nemám moc času – nejdříve byly písemky ve škole a teď jsou prázdniny. Navíc byly poslední dobou úmorná horka (kolem 40°C ve stínu) a řeknu Vám, že v tom je psaní nějakého článku opravdu velmi těžké. Ale je to tak. Jo, je to celkem dost hloupá výmluva…

Ale teď už jsem zpět a píšu pro Vás tenhle článek. Ještě předtím bych Vám chtěl oznámit, že pro Vás chystám jednu bezvadnou novinku, snad ji oceníte. Ale o tom až někdy později – předpokládám během září 2015.

Dlouho jsem přemýšlel, jaký článek pro Vás napsat a napadlo mě, že bychom si mohli vytvořit vlastní zkracovač URL adres. Bude to mít velmi primitivní funkčnost a použijeme přitom databázi MySQL. Pusťme se do toho!

Takže, nejdříve (ostatně, jak tomu bývá zvykem u všech mých článků) si shrneme, co vlastně chceme programovat, co k tomu použijeme a hlavně – jak to bude fungovat (DB = databáze):

  • Na hlavní stránce bude možnost vytvořit novou zkrácenou adresu a zároveň přejít na tu již existující
  • PŘIDÁNÍ
    • Na hlavní stránce bude formulář pro přidání URL
    • Budou tam dvě políčka – původní a nová zkrácená verze
      • Zkrácená URL se nebude sama generovat, ale uživatel si ji musí sám vymyslet
    • Po kliknutí na přidávací button se provede následující
  • ODESLÁNÍ DO DB
    • Z klientského formuláře se vezmou dvě data
      • původní adresa (cíl)
      • nová adresa (alias)
    • Obě data se uloží do DB do dvou sloupců
      • alias
      • cil
  • POTVRZENÍ PŘIDÁNÍ
    • Uživateli pouze potvrdíme, že alias i cíl byl úspěšně uložen do DB
    • A zobrazíme mu klikatelný odkaz aliasu (zkrácené adresy)
  • ŽÁDOST O ZOBRAZENÍ ADRESY
    • Uživatel zašle požadavek na server s aliasem
    • A žádá nás o přesměrování na správnou adresu
    • My se podíváme do DB
      • A zjistíme, jestli je v DB ve sloupci alias shoda s aliasem, který nám uživatel poslal
      • Pokud ano, zjistíme si i ve stejném řádku cíl tohoto aliasu
      • A na tuto adresu ho přesměrujeme
    • Pokud v DB shodu nenalezneme, zobrazíme chybovou hlášku

A jdeme programovat 🙂

Nejprve si vytvoříme potřebnou tabulku a sloupce v MySQL. Tabulku nazveme url a budeme mít dva sloupce – alias a cil – omezenou délku nechávám na Vás, ale nezapomínejte, že se jedná o URL adresy a někdy mohou být pekelně dlouhé.

Dalším krokem bude vytvořit si konfigurační soubor pomocí kterého budeme komunikovat s databází. Nazveme ho config.inc.php. Uložíme do ní název databázového serveru, uživatele, heslo a databázi. Potom ještě nastavím správné a jednotné kódování, pomocí kterého budeme s databází komunikovat – UTF-8. Toto kódování doporučuji používat ve všech našich skriptech.

<?php  
$server = 'dbserver.koncovka'; //server, na kterém je DB 
$uzivatel= 'uzivatel'; //jméno uživatele 
$heslo = 'heslo'; //heslo uživatele 
$db = 'databaze'; //název databáze  

//pokusíme se připojit 
$link = mysql_connect($server, $uzivatel, $heslo) or die("Could not connect: " . mysql_error()); 

//vybereme databázi 
mysql_select_db($db, $link) or die ('Nemohu se pripojit ' . mysql_error());  

//a nakonec nastavíme jednotné kódování UTF-8 
mysql_query("SET NAMES UTF8");  
?>

No a potom už můžeme začít postupně skládat soubor vlozit.php, který bude sloužit pro vkládání nových záznamů do DB. Ještě dodám, že použijeme antispamovou ochranu už z minulého článku. Nejdříve jednoduchý formulář (to, že používám teď <center> je jenom proto, aby to nějak vypadalo):

<center>
  <h2>Zkracovač URL adres</h2> 
  <form method="post" action="#"> 
    URL ke zkrácení: <input type="text" value="http://" name="cil"><br> 
    http://url.mujskript.cz/<input type="text" name="alias"><br> 
    <p id="spamprotirobotum">Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: <input type="text" name="robot" value="" id="protirobotum"></p> 

<button type="submit">Zkratit!</button> </form>
</center>

<script> /* tento skript vloží do příslušného políčka  */ 
document.getElementById("protirobotum").value = 13 * 19; 
document.getElementById("spamprotirobotum").style.display = "none"; 
</script>

Jak jste i mohli všimnout, formulář už obsahuje JS ochranu před spamem. Teď si v PHP definujeme proměnné a připojíme se k databázi:

<?php  
require_once ("config.inc.php");     
$alias = $_POST['alias']; 
$cil = $_POST['cil']; 
$robot = $_POST['robot'];

//A ochráníme se před útoky

$alias = htmlspecialchars($alias); 
$cil = htmlspecialchars($cil); 
$alias = mysql_real_escape_string($alias); 
$cil = mysql_real_escape_string($cil);

Následně si vytvoříme podmínku pro antispamovou ochranu a poté budeme pokračovat ve skriptu:

if($robot == 247){ 
  $query = "INSERT INTO `url`(`alias`,`cil`) VALUES 
    ('$alias','$cil')";  
  $result = mysql_query($query);  

  if(!$result){ 
    echo  mysql_error() . " - " . mysql_errno();  
  }else{
    echo 'Nyní už můžete ostatní odkázat na adresu'; 
    echo '<a href="http://url.mujskript.cz/?u='.$alias.'">http://url.mujskript.cz/?u='.$alias; 
  }
} 
?>

A teď si skript rozebereme. Přidali jsme podmínku, že pokud v $robot je 247, tak se pokračuje dále to přesně: Vytvoří se SQL dotaz s daty a pošle se do DB. V další podmínce se ověřuje, zda nedošlo k chybě, pokud ano, tak se vypíše. V opačném případě (pokud nedošlo k chybě) se zobrazí odkaz na zkrácenou URL.

TIP! Doporučuji všechny řetězce escapovat před útoky pomocí htmlspecialchars (více).

No a nyní si vytvoříme poslední soubor a to index.php, ve kterém se bude ověřovat správnost krátké URL a přesměruje se na ni a také se tam includne soubor pro vložení adresy (vlozit.php), Soubor index.php tedy bude vypadat:

<?php 
  require_once ("config.inc.php");  
  $zadost = $_GET['u']; 
  $zadost = htmlspecialchars($zadost);

Opět se připojíme k DB a definujeme si proměnné. Do proměnné $zadost se nám bude ukládat požadavek od uživatele (http://domena.cz/?u=neco) a to „neco“ je právě obsah proměnné $zadost. Následně tuto proměnnou ještě escapujeme.

A poté si už složíme dotaz, zda URL existuje (viz. začátek teorie nahoře). „Vyber z tabulky url všechny záznamy, kde se obsah sloupce alias rovná proměnné $zadost“. URL budeme předávat pomocí superglobální proměnné $GET (více). Dotaz pošleme do databáze a požádáme o výsledek:

$query_sel = "SELECT * FROM `url` WHERE `alias`='$zadost'";  
$result_sel = mysql_query($query_sel); 
$row = mysql_fetch_assoc($result_sel);

Nyní máme výsledek obsažený v proměnné $row[‚alias‘] (ta se nám vrátila z DB) a ještě ho porovnáme s proměnnou $zadost (tu jsme dostali od uživatele).

Takže vytvoříme podmínku, pokud se záznam našel a pokud ne:

if(isset($zadost)){
  if ($row['alias'] == $zadost){
    header("Location:".$row['cil']); 
  }else{
    echo "Tento záznam (".$zadost.") neexistuje!"; 
  }
}

Pokud se záznam v tabulce url našel, tak se rovnou přesměruje na cíl, pokud v záznam v tabulce neexistuje, upozorníme na to. Nakonec můžeme ještě includnou soubor pro vložení záznamu vlozit.php, ale nemusíme:

include "vlozit.php"; 
?>

V případě, že bychom si chtěli vypsat všechny záznamy z DB (tj. alias i cíl), můžeme:

<?php 
  require_once ("config.inc.php");   

//vybereme všechny záznamy z tabulky url a seřadíme je podle jejich id (1, 2, 3...) 
$query_sel = "SELECT * FROM `url` ORDER BY `id`";  

//řekneme, že toto je příkaz do DB 
$result_sel = mysql_query($query_sel);  

//pokud se příkaz z nějakého důvodu nevykonal 
if(!$result_sel){  

  //vypiš chybovou hlášku
  echo  mysql_error() . " - " . mysql_errno();      
  }  //pokud se žádná chyba nestala     
else{  
    //tak projdeme celou tabulku pomoci while a prok aždý záznam vytvoříme asociativní pole         
    while($row = mysql_fetch_assoc($result_sel)){  

      //a teď už jen vypíšeme každý řádek (generují se samy díky mysql_fetch_assoc)             
      echo "<p>";  //a v $row je vždy uložen obsah řádku konkrétního pole             
      echo "alias: " . $row['alias'] . "<br>";              
      echo "cil: " . $row['cil'];              
      echo "</p>";          
    }      
}  
?>

Shrnutí

Vytvořili jsme si opravdu jednoduchý zkracovač URL. Pokud si vše přenesete na Váš server, nebo vyzkoušíte živě tento zkracovač (odkaz níže), mohla by se Vám hodit nápověda:

Do prvního políčka se vkládá původní URL adresa – např. „http://seznam.cz“ a do druhého políčka se vkládá jen zkrácená adresa pro odkaz (szn). Po potvrzení se Vám vygeneruje link. Je delší, ale pomocí .htaccess si ten parametr $GET[‚u‘] můžete skrýt a rovnou i použít kratší a lepší doménu.

Nápady na vylepšení:

  • mohlo by to umět pomocí .htaccess odstranit ten $GET parametr
  • mohlo by to počítat počet kliků (třeba podle mého skriptu)
  • mělo by to mít ošetřené všechny vstupy pomocí htmlspecialchars – do DB, u už. části už je
  • mohlo by to umět samo generovat zkrácené url (aaa, aab, aac, aad… ….kbn, kbm)
  • mohlo by to zamezit vkládání stejných aliasů a vypsat třeba „Tento záznam už existuje!“

Pokud by Vás napadlo nějaké další vylepšení, klidně mi napište na mail, nebo do komentářů

To je vše. Snad jsem Vám pomohl. Celý skript je samozřejmě ke stažení a vyzkoušení zdarma:

Vyzkoušet živě zkracovač URL 

Stáhnout Zkracovač URL adres (.zip)

Napište komentář!