Jednoduchý online chat v PHP a JavaScripte – úvod

24. srpna 2001

Určite každý z vás natrafil na stránku, na ktorej komunikovalo medzi sebou viacej ľudí naraz. Pomocou PHP a JavaScriptu som vytvoril takýto jednoduchý chat, ktorý si môžete aj vyskúšať.

Stránka bude vytvorená zo 4 rámcov. V poslednom „reklama“ budeme zobrazovať reklamu na nejakom free webhostingu. Každý z nich si pomenujeme:

<frameset rows=“100,*,20″>
  <frameset cols=“34%,*“>
    <frame src=“head.php?oldSize=<?ClearStatCache(); echo FileSize($subor)?>“ name=“head“>
    <frame src=“form.php?name=&sprava=“ name=“form“>
  </frameset>
  <frame src=“show.php“ name=“show“>
  <frame src=“reklama.html“ name=“reklama“>
</frameset>

Nech sa stránka s nadefinovaním rámcov volá index.php. Stránka v rámci „head“ slúži na kontrolu zmeny veľkosti súboru, v ktorom sú uložené všetky odkazy. Ak táto zmena nastane, vygeneruje sa opäť stránka head.php, avšak bude obsahovať JavaScript, ktorý zabezpečí, aby sa obnovil rámec „show“, v ktorom zobrazujeme odkazy. Tento spôsob je výhodný najmä preto, lebo rámec „show“ s odkazmi sa obnoví iba vtedy, ak pribudne nový odkaz. Rámec „form“ obsahuje formulár na meno a správu, ktorou chceme prispieť do odkazov.

Okrem nadefinovania rámcov súbor index.php obsahuje aj kúsok PHP kódu.

<?
require „./const.php“;
ClearStatCache(); // vymaz vyrovnavaciu pamet
if(!File_Exists($subor)) // ak subor neexistuje – vytvor ho
  FClose(FOpen($subor,“w“));
?>

Najskôr si načítame súbor const.php, ktorý obsahuje premenné, ktoré budeme používať vo viacerých skriptoch. Sú to tieto premenné:

<?
$subor = „./data.txt“; // cesta k suboru, kde sa budu ukladat spravy
$maxDlzkaMeno = 8; // maximalna dlzka retazca „meno“
$maxDlzkaSprava = 80; // maximalna dlzka retazca „sprava“
$maxPocetOdkaz = 15; // kolko poslednych odkazov sa ma zobrazovat ?
// format zobrazenia spravy
$format = sprintf(„%s <b>%%%d.%ds: </b>%%-%d.%ds<br>“,Date(„d.m.Y H:i:s“),$maxDlzkaMeno,$maxDlzkaMeno,$maxDlzkaSprava,$maxDlzkaSprava);
// kolko bajtov obsahuje maxPocetOdkaz ?
$maxOdkazByte = StrLen(sprintf($format,““,““)) * $maxPocetOdkaz;
?>

Myslím, že význam premenných je zrejmý z komentárov, jedine $format by mohol robiť problémy. Ide o formát, v akom chceme, aby sa zobrazovali (a ukladali do súboru) odkazy. Pričom jeho výsledný tvar musí obsahovať dve „%s“, pretože zapisovať do súboru budeme nasledovne sprintf($format,$meno,$sprava).

Vráťme sa opäť k súboru index.php. Funkcia ClearStatCache() nám vymaže vyrovnávaciu pamäť, aby sme získali aktuálne informácie o existencii súboru.

if(!File_Exists($subor)) // ak subor neexistuje – vytvor ho
  FClose(FOpen($subor,“w“));

Pri definovaní rámcov za súbor „head.php“ pripájame hodnotu premennej oldSize, čo je veľkosť súboru s odkazmi. Aby sme neskôr mohli skontrolovať, či pribudol nový odkaz.

Súbor head.php sa bude načítavať v pravidelných časových intervaloch a bude kontrolovať, či pribudol nový odkaz (zmena veľkosti premennej $oldSize). Na úvod si zabezpečíme, aby sa stránka neukladala do cache. Inak by sa mohlo stať, že by sa obnovila iba z cache a neposkytla nám údaje o zmene v súbore s odkazmi.

<?
Header(„Pragma: no-cache“);
Header(„Cache-control: no-cache“);
Header(„Expires: „.GMDate(„D, d m Y H:i:s“).“ GMT“);
?>

Nasledujúci kód porovná veľkosti súboru s odkazmi pred a po časovom intervale a ak nastala zmena, obnoví rámec so zobrazenými odkazmi:

<?
require „./const.php“;
ClearStatCache(); // vymaz vyrovnavaciu pamet
$newSize = FileSize($subor); // zisti velkost suboru
if($newSize != $oldSize): // pribudol novy odkaz ?
?>
  <script language=“JavaScript“>
  parent.frames[„show“].location = „show.php“ // obnov ramec „show“
  </script>
<?
endif;
?>

Navyše je tu ešte kúsok JavaScriptu, ktorý zobrazuje, za koľko sekúnd sa opäť prevedie kontrola veľkosti súboru s odkazmi. JavaScript odpočítavanie by sme mohli nahradiť aj meta tagom, samozrejme medzi tagy <head> a urobiť malé úpravy v postupnosti spracovania kódu.

<meta http-equiv=“Refresh“ content=“10; URL=./head.php?oldSize=<?echo $newSize?>“>

V súbore form.php máme jednoduchý formulár s menom a správou. Pri odosielaní sa zapíše meno aj správa do súboru s odkazmi vo formáte, ako sme si ho definovali v const.php v premennej $format. Tu musím upozorniť, že každý odkaz uložený v súbore má rovnaký počet bajtov. To preto, aby sme sa jednoducho mohli nastaviť na posledných $maxPocetOdkaz odkazov. Preto je meno a správa v tvare napr. „%5.5s“. Čím si zabezpečíme stály minimálny a maximálny počet znakov (bajtov) na odkaz. Preto aj reťazec vrátený z Date() musí mať zakaždým rovnaký počet znakov. Odkaz sa do súboru zapíše, iba ak správa niečo obsahuje. Vstupy sú jednoducho ošetrené, znaky <>& sú nahradené znakom * a lomítka spred citlivých (napr. \n \“) sú odstránené:

StripSlashes(StrTr($meno,“<>&“,“***“))

Ak je pridaný nový odkaz, nečaká sa na časový interval, ale obnoví sa rámec „show“ s novými odkazmi. Aby užívateľ videl, že odkaz sa už pridal a onedlho ho uvidia aj ostatný užívatelia.

Show.php vypíše posledných $maxPocetOdkaz odkazov, ak je ich v súbore viacej ako $maxPocetOdkaz. Inak sa zobrazia všetky odkazy.

$fp = FOpen($subor,“r“); // otvor subor na citanie
ClearStatCache(); // vymaz vyrovnavaciu pamet
$velkostSuboru = FileSize($subor); // zisti velkost suboru
if($velkostSuboru > $maxOdkazByte) // uz mam v datovom subore viac sprav ako maxPocetOdkaz ?
  FSeek($fp,$velkostSuboru – $maxOdkazByte); // zmen poziciu na poslednych maxPocetOdkaz
FPassThru($fp); // vypis suboru od aktualnej pozicie & zatvor subor

V súbore „show.php“ opäť pomocou hlavičiek prikážeme, aby sa stránka zakaždým načítala zo serveru. Ako sami vidíte zápis do súboru a načítavanie premenných je urobené čo najjednoduchšie, ale ako ukážka to isto postačí. Hlavná myšlienka bola, aby sa stránka, ktorá zobrazuje odkazy nenačítavala vtedy, keď to nie je potrebné (takto je totiž urobená väčšina „chatov“ na internete). Rámec „head“, ktorý sa obnovuje v pravidelných časových intervaloch je vhodné na stránke urobiť čo najmenší, aby pri opätovnom načítavaní “ nepreblikoval“. Keďže každý odkaz má rovnaký počet bajtov, nebude problém chat obohatiť o zobrazenie ľubovoľného počtu (alebo všetkých – postupne) doposiaľ uložených odkazov. Prípadne každého „chatujúceho“ odlíšiť farebne, alebo veľkosťou písma. Ďalšie úpravy sú už na vás.

Súbory potrebné k „chatovaniu“ sú zabalené (zip) tu.

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

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

Mohlo by vás také zajímat

Nejnovější

9 komentářů

  1. Juraj

    Zář 29, 2009 v 15:15

    Mne ten zip archiv nesiel na stránke, písalo chybu v 7.riadku súbru index.php v príkaze fopen a fclose. Riešil som to zmazaním php kodu, aby som skontroloval ostatne framy, no v kazdom vypisalo chybu, i ked som dodatocne vytvoril v adresari subor data.txt . Prosím o pomoc. Dakujem :)

    Odpovědět
  2. Adam

    Lis 30, 2009 v 7:25

    Ja som to skusal, tiez mi pisalo tu chybu. Hned som siel na FTP a hodil som tam data.txt, a nastavil som (to si zrejme nespravil ty) chmod na 777 a uz to fungovalo :D

    Odpovědět
  3. matus

    Pro 7, 2010 v 21:35

    co je to chmod?

    Odpovědět
  4. pali

    Bře 19, 2011 v 2:29

    Ja som ten chat skúšal tiež a fungoval len v PC s použitím vetrigo na php, ale na normálnom serveri mi síce fungovalo písanie aj som stlačil odoslať, ale kam to odoslalo, to už neviem, pretože na show som to nevidel a napísal som viacero správ.

    Odpovědět
  5. Michal Grňo

    Srp 29, 2011 v 16:13

    Super, moc mi to pomohlo! Trochu jsem to předělal, aby tam šlo psát & a aby tam fungovaly tagy :D

    Odpovědět
  6. Ján Kucan

    Lis 23, 2011 v 21:40

    Dobry navod, potreboval som iba vediet urobit refresh. Teraz to urobim cez databazu. To je lepsie ako ukladat do nieco.txt ;)

    Odpovědět
  7. Ján Kucan

    Lis 23, 2011 v 22:52

    Som ti strasne vdacny za tie javascripty! Ostatne som zmenil lebo ja to mam cez databazu

    Odpovědět
  8. martin

    Čvc 22, 2012 v 10:41

    prosim vas ma niekto ten chat kompletny a funkcny?

    Odpovědět
  9. Anonym

    Říj 10, 2014 v 21:25

    Par komentov:

    ked sa pise staci dat

    v systeme su premenne $sprava, $meno, tieto som nikde nenasiel osadene napr. $sprava = $_GET[‚sprava‘];

    Odpovědět

Napsat komentář: Adam Zrušit odpověď na komentář

Vaše e-mailová adresa nebude zveřejněna. Vyžadované informace jsou označeny *