Geek tričko zdarma Geek tričko zdarma
Tričko zdarma! Stačí před dobitím bodů použít kód TRIKO15. Více informací zde

Lekce 6 - NERS - Editor článků v PHP

Unicorn College Tento obsah je dostupný zdarma v rámci projektu IT lidem.
Vydávání, hosting a aktualizace umožňují jeho sponzoři.

V minulé lekci, NERS - Registrace uživatelů v PHP, jsme dokončili administrační stránku jednoduchého redakčního systému. V dnešním PHP tutoriálu přidáme přihlašování.

Přihlašování

Vytvoříme skript prihlaseni.php. Jeho HTML část bude následující:

<!DOCTYPE html>
<html lang="cs-cz">
<head>
        <meta charset="utf-8" />
        <link rel="stylesheet" href="styl.css" type="text/css" />
        <title>Přihlášení do administrace</title>
</head>

<body>
        <article>
                <div id="centrovac">
                        <header>
                                <h1>Přihlášení do administrace</h1>
                        </header>
                        <section>
                                <?php
                                if (isset($zprava))
                                        echo('<p>' . $zprava . '</p>');
                                ?>

                                <form method="post">
                                        Jméno<br />
                                        <input type="text" name="jmeno" /><br />
                                        Heslo<br />
                                        <input type="password" name="heslo" /><br />
                                        <input type="submit" value="Přihlásit" />
                                </form>

                                <p>Pokud ještě nemáte účet, <a href="registrace.php">zaregistrujte se</a>.</p>
                        </section>
                        <div class="cistic"></div>
                </div>
        </article>
</body>
</html>

Vidíme PHP direktivu pro výpis chybové zprávy (pokud existuje) a formulář se jménem a heslem. Kód je téměř totožný s tím u registračního formuláře a měl by být tedy srozumitelný.

Nad HTML vložíme následující PHP blok:

<?php
session_start();
require('Db.php');
Db::connect('127.0.0.1', 'ners_db', 'root', '');

if (isset($_SESSION['uzivatel_id']))
{
        header('Location: administrace.php');
        exit();
}

if ($_POST)
{
        $uzivatel = Db::queryOne('
                SELECT uzivatele_id, admin, heslo
                FROM uzivatele
                WHERE jmeno=?
        ', $_POST['jmeno']);
        if (!$uzivatel || !password_verify($_POST['heslo'], $uzivatel['heslo']))
                $zprava = 'Neplatné uživatelské jméno nebo heslo';
        else
        {
                $_SESSION['uzivatel_id'] = $uzivatel['uzivatele_id'];
                $_SESSION['uzivatel_jmeno'] = $_POST['jmeno'];
                $_SESSION['uzivatel_admin'] = $uzivatel['admin'];
                header('Location: administrace.php');
                exit();
        }
}
?>

První řádky nám zpřístupní session a připojí se k databázi. Pokud je uživatel přihlášený, tak mu přihlašovací stránku zobrazovat nebudeme a přesměrujeme ho rovnou na administraci a skript zastavíme.

Pokud byl odeslán formulář, vybereme z databáze informace o uživateli podle zadaného jména a zkontrolujeme, zda se zadané heslo shoduje s otiskem hesla. Toho docílíme funkcí password_verify(), které zadáme jako parametry heslo a jeho otisk. Funkce nám následně vrátí true/false, podle toho, zda heslo souhlasí, či nikoliv. Pokud uživatele nenajdeme nebo bylo zadáno chybné heslo, uložíme chybovou hlášku. V případě úspěchu uložíme načtené informace o uživateli do session a tím ho přihlásíme. Dále ho přesměrujeme na administraci.

Můžete se zkusit přihlásit. Pokud jste ještě přihlášení z registrace, tak se odhlaste a přihlaste znovu.

Přihlašování uživatelů v PHP

Přidělení role administrátora

Tento výukový obsah pomáhají rozvíjet následující firmy, které dost možná hledají právě tebe!

V našem systému máme u každého uživatele sloupec admin. Ten bude nabývat hodnoty 0 nebo 1 podle toho, zda je uživatel administrátor. Tuto hodnotu může nastavit nově registrovanému uživateli pouze administrátor webu pomocí phpMyAdmin. Přesuneme se tedy do phpMyAdmin a přepneme hodnotu admin u našeho účtu na 1 (na políčko stačí jen poklikat a hodnotu přepsat).

Administrátorská práva v phpMyAdmin

Nyní se odhlaste a přihlaste.

Editor článků

Přejděme k editoru článků. Vytvořme soubor editor.php a vložme do něj HTML blok:

<!DOCTYPE html>
<html lang="cs-cz">
<head>
        <meta charset="utf-8" />
        <link rel="stylesheet" href="styl.css" type="text/css" />
        <title>Editor článků</title>
</head>

<body>
        <article>
                <div id="centrovac">
                        <header>
                                <h1>Editor článků</h1>
                        </header>
                        <section>
                                <?php
                                if (isset($zprava))
                                        echo('<p>' . $zprava . '</p>');
                                ?>

                                <form method="post">
                                        <input type="hidden" name="clanky_id" value="<?= htmlspecialchars($clanek['clanky_id']) ?>" /><br />
                                        Titulek<br />
                                        <input type="text" name="titulek" value="<?= htmlspecialchars($clanek['titulek']) ?>" /><br />
                                        URL<br />
                                        <input type="text" name="url" value="<?= htmlspecialchars($clanek['url']) ?>" /><br />
                                        Popisek<br />
                                        <input type="text" name="popisek" value="<?= htmlspecialchars($clanek['popisek']) ?>" /><br />
                                        Klíčová slova<br />
                                        <input type="text" name="klicova_slova" value="<?= htmlspecialchars($clanek['klicova_slova']) ?>" /><br />
                                        <textarea name="obsah"><?= htmlspecialchars($clanek['obsah']) ?></textarea>
                                        <input type="submit" value="Odeslat" />
                                </form>
                        </section>
                        <div class="cistic"></div>
                </div>
        </article>
        <script type="text/javascript" src="//tinymce.cachefly.net/4.0/tinymce.min.js"></script>
        <script type="text/javascript">
                tinymce.init({
                        selector: "textarea[name=obsah]",
                        plugins: [
                                "advlist autolink lists link image charmap print preview anchor",
                                "searchreplace visualblocks code fullscreen",
                                "insertdatetime media table contextmenu paste"
                        ],
                        toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image",
                        entities: "160,nbsp",
                        entity_encoding: "named",
                        entity_encoding: "raw"
                });
        </script>
</body>
</html>

Kód obsahuje opět jen jednoduchý HTML formulář a výpis chybové zprávy. Data se do formulářových polí vypisují z pole $clanek. Formulář má ještě jednu zvláštnost a tou je skryté pole s ID daného článku. Podle tohoto pole poznáme, zda vkládáme nový článek (bude prázdné) nebo zda editujeme existující (bude v něm ID tohoto článku).

Zajímavý je JavaScript na konci souboru, ve které načteme WYSIWYG editor TinyMCE. To je editor vzhledově podobný např. MS Wordu, který nám generuje HTML kód podle toho, co v něm naklikáme.

První skript je odkaz na online úložiště, ze kterého si prohlížeč TinyMCE stáhne. Druhý skript obsahuje nastavení editoru, zvolíme, že editor chceme vytvořit z textarea s názvem obsah. Další řádky nastavují pluginy a vypínají převod české diakritiky na entity, což je jinak poměrně nepříjemná záležitost.

Nad HTML kód dodejme obslužný PHP blok:

<?php
session_start();
if (empty($_SESSION['uzivatel_admin']))
        die('Nedostatecna opravneni');

require('Db.php');
Db::connect('127.0.0.1', 'ners_db', 'root', '');

$clanek = array(
        'clanky_id' => '',
        'titulek' => '',
        'obsah' => '',
        'url' => '',
        'popisek' => '',
        'klicova_slova' => '',
);
if ($_POST)
{
        if (!$_POST['clanky_id'])
        {
                Db::query('
                        INSERT INTO clanky (titulek, obsah, url, popisek, klicova_slova)
                        VALUES (?, ?, ?, ?, ?)
                ', $_POST['titulek'], $_POST['obsah'], $_POST['url'], $_POST['popisek'], $_POST['klicova_slova']);
        }
        else
        {
                Db::query('
                        UPDATE clanky
                        SET titulek=?, obsah=?, url=?, popisek=?, klicova_slova=?
                        WHERE clanky_id=?
                ', $_POST['titulek'], $_POST['obsah'], $_POST['url'], $_POST['popisek'], $_POST['klicova_slova'], $_POST['clanky_id']);
        }
        header('Location: index.php?clanek=' . $_POST['url']);
        exit();
}
else if (isset($_GET['url']))
{
        $nactenyClanek = Db::queryOne('
                SELECT *
                FROM clanky
                WHERE url=?
        ', $_GET['url']);
        if ($nactenyClanek)
                $clanek = $nactenyClanek;
        else
                $zprava = 'Článek nebyl nalezen';
}

?>

Pokud uživatel není administrátor, zastavíme celý skript s chybovou hláškou. Pro kontrolu přihlášení administrátora nám nestačí isset(), ale musíme použít empty(). V session totiž může existovat klíč 'uzivatel_admin', ale může mít hodnotu 0.

Dále se připojíme k databázi a do proměnné $clanek si připravíme pole s prázdnými hodnotami. To aby se do formuláře nic nevypsalo a zároveň nám PHP neohlásilo chybu s neexistující proměnnou.

Pokud byl odeslán formulář, podíváme se do skrytého pole. Pokud je prázdné, vložíme nový článek do databáze. Pokud je v skrytém poli nějaká hodnota, updatujeme článek s tímto ID. SQL příkaz UPDATE jsme si ještě nepředstavovali, ale je velmi jednoduchý. Pomocí SET jednoduše nastavíme pole která potřebujeme. Co je důležité je nezapomenout na klauzuli WHERE, kde určíme které řádky se mají takto updatovat. Bez ní by se updatovaly všechny články na tyto hodnoty!

Po přidání nebo editaci článku na něj přesměrujeme.

Pokud nebyl odeslaný formulář, podíváme se, zda nemáme v GET url článku. To by znamenalo, že chceme nějaký editovat a proto se do pole $clanek pokusíme nahrát data z článku s tímto URL. Data se potom předvyplní do polí formuláře. Při neúspěchu vypíšeme chybovou hlášku.

Nyní si editor spusťte a vložte si článek s URL "uvod". To bude hlavní stránka našeho webu:

Editor článků TinyMCE v PHP

Článek uložte do databáze. Pokračovat budeme zas v příští lekci, NERS - Výpis článků v PHP.


 

 

Článek pro vás napsal David Čápka
Avatar
Jak se ti líbí článek?
17 hlasů
Autor pracuje jako softwarový architekt a pedagog na projektu ITnetwork.cz (a jeho zahraničních verzích). Velmi si váží svobody podnikání v naší zemi a věří, že když se člověk neštítí práce, tak dokáže úplně cokoli.
Unicorn College Autor sítě se informační technologie naučil na Unicorn College - prestižní soukromé vysoké škole IT a ekonomie.
Předchozí článek
NERS - Registrace uživatelů v PHP
Všechny články v sekci
Databáze v PHP pro začátečníky
Miniatura
Následující článek
NERS - Výpis článků v PHP
Aktivity (5)

 

 

Komentáře
Zobrazit starší komentáře (86)

Avatar
Zdeněk Srb
Člen
Avatar
Zdeněk Srb:7.10.2018 9:50

Tak říkáš aplikaci jaké proměnné z toho formuláře očekáváš a zbytek tě nazajímá, jde o další vrstvu ochrany proti koncovému uživateli.

 
Odpovědět  +1 7.10.2018 9:50
Avatar
Michal Lustig:28. ledna 11:18

Co mi chybí u editoru je upload obrázků do článku. Nebo Vám to funguje?

 
Odpovědět 28. ledna 11:18
Avatar
Michal Lustig:30. ledna 12:14

Prosím, potřebuji poradit. Jak dostanu do Tiny plugin na přidání obrázků z localu?

 
Odpovědět 30. ledna 12:14
Avatar
Tomáš Novotný:25. února 9:00

Ahoj,
jak se by se dalo řešit případné podvrhnutí id clanku, když bych skrytý input změnil? Jde mi spíše o principiální přístup. Nápady? Praxe?

Odpovědět 25. února 9:00
∞ ... the exact amount of possibilities how to deal with the situation ... so by calm, your solution is one of many
Avatar
Stivko
Člen
Avatar
Stivko:16. června 16:14

Zdravím,

Mám problém. Udělal jsem vše dle návodu, ale když se chci přihlásit a zadám jakékoliv jméno a heslo napíše mi prohlížeč tohle: Fatal error: Uncaught Error: Call to undefined method Db::querryOne() in "umístění souboru, řádek 12"

<?php
session_start();
require('Db.php');
Db::connect('localhost', 'loginsystem', 'root', '');

if (isset($_SESSION['uzivatel_id'])) {
    header ('Location: administrace.php');
    exit();
}

if ($_POST) {
    $uzivatel = Db::querryOne('
    SELECT user_id, user_password
    WHERE user_uid=?', $_POST['username']);

    if (!$uzivatel || !password_verify($_POST['password'], $uzivatel['user_password'])) {
        $zprava = "Nesprávné uživatelské jméno nebo heslo";
    }
    else {
        $_SESSION['uzivatel_id'] = $uzivatel['user_id'];
        $_SESSION['uzivatel_jmeno'] = $uzivatel['user_uid'];
        header ('Location: administrace.php');
    }


}

Nevíte, kde je chyba? Budu rád za každou radu. Děkuji

Odpovědět 16. června 16:14
Nikdy není pozdě začít s něčím novým
Tento výukový obsah pomáhají rozvíjet následující firmy, které dost možná hledají právě tebe!
Avatar
Jan Lupčík
Šéfredaktor
Avatar
Odpovídá na Stivko
Jan Lupčík:16. června 17:13

Ahoj, jak již z chyby vyplývá (Uncaught Error: Call to undefined method), voláš neexistující metodu. Totiž querryOne s dvěma R neexistuje :`
Asi jsi měl na mysli metodu queryOne :)

Odpovědět 16. června 17:13
TruckersMP vývojář
Avatar
Stivko
Člen
Avatar
Odpovídá na Jan Lupčík
Stivko:16. června 17:17

Ahoj,

Že mě to nenapadlo hned. Nicméně pokud jdu dále, vyskočí na mě error, který souvisí s Db.php a jelikož to jsem stáhl v rámci studijních materiálu, protože k objektovému programování jsem se ještě nedostal, tady asi můj zásah končí. Error mi zobrazí tohle.

"Warning: PDO::prepare(): SQLSTATE[42000]: Syntax error or access violation: 1064 You have an error in your SQL syntax; check the manual that corresponds to your MariaDB server version for the right syntax to use near 'WHERE user_uid=?' at line 2 in C:\xampp\htdoc­s\steven\admin\Db­.php on line 60

Fatal error: Uncaught Error: Call to a member function execute() on bool in C:\xampp\htdoc­s**********\Db­.php:61 Stack trace: #0 C:\xampp\htdoc­s************\Db­.php(92): Db::executeSta­tement(Array) #1 C:\xampp\htdoc­s**********\lo­gin.inc.php(13): Db::queryOne('SE­LECT user_id ...', 'admin') #2 {main} thrown in C:\xampp\htdoc­s************\Db­.php on line 61"

Je možné, že se za tu dobu, co autor vytvořil pro tuto vyuku soubor Db.php něco změnilo? Děkuji za případne rady

Editováno 16. června 17:18
Odpovědět 16. června 17:17
Nikdy není pozdě začít s něčím novým
Avatar
Jan Lupčík
Šéfredaktor
Avatar
Odpovídá na Stivko
Jan Lupčík:16. června 17:26

V tom dotazu ti chybí FROM uzivatele. Nevšiml jsem si toho hned napoprvé, moje omluva :`
Správně by to teda mělo být:

$uzivatel = Db::queryOne('
    SELECT user_id, user_password
    FROM uzivatele
    WHERE user_uid=?
', $_POST['username']);

Za předpokladu, že sloupeček user_uid existuje a nemá to být user_id :)

Odpovědět 16. června 17:26
TruckersMP vývojář
Avatar
Stivko
Člen
Avatar
Odpovídá na Jan Lupčík
Stivko:16. června 17:35

Ano, máš pravdu. Teď je akorát divné to, že pokud se nyní zkusím přihlásit, tak se mi za každých okolností (správné, špatné heslo, či nevyplnění) zobrazí prázdná stránka, ikdyž jsem nastavil, že při správném hesle se mám přesměrovat na administrace.php viz kod. Nevíš čím, to může být?

<?php
session_start();
require('Db.php');
Db::connect('localhost', 'loginsystem', 'root', '');

if (isset($_SESSION['uzivatel_id'])) {
    header ('Location: administrace.php');
    exit();
}

if ($_POST) {
    $uzivatel = Db::queryOne('SELECT user_id, user_password
    FROM users WHERE user_uid=?', $_POST['username']);

    if (!$uzivatel || !password_verify($_POST['password'], $uzivatel['user_password'])) {
        $zprava = "Nesprávné uživatelské jméno nebo heslo";
    }
    else {
        $_SESSION['uzivatel_id'] = $uzivatel['user_id'];
        $_SESSION['uzivatel_jmeno'] = $uzivatel['user_uid'];
        header ('Location: administrace.php');
        exit();
    }


}

tady je výstřižek na to "přesměrování"

else {
    $_SESSION['uzivatel_id'] = $uzivatel['user_id'];
    $_SESSION['uzivatel_jmeno'] = $uzivatel['user_uid'];
    header ('Location: administrace.php');
    exit();
}
Editováno 16. června 17:36
Odpovědět 16. června 17:35
Nikdy není pozdě začít s něčím novým
Avatar
Odpovídá na Michal Lustig
Jiří Pecher:10. září 20:53

Ahoj, co vím, tak možnost vkládání obrázků z vlastního zdroje (tedy obrázek máš u sebe v PC a chceš ho vložit na web) je u TinyMCE možná jen s pomocí placeného pluginu.

Odpovědět 10. září 20:53
"Když nemám co dělat, pracuji."
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 10 zpráv z 96. Zobrazit vše