We gaan een simpel project starten. Een van de meest gezochte onderwerpen: hoe maak ik een eigen login op mijn site? En om je zelf te leren programmeren in PHP een uiterst nuttig onderwerp om de technieken onder de knie te krijgen. We hebben het zelf ook zo geleerd.
Is het handig voor een live website? Nou…. nee. Er zijn inmiddels enkele grote spelers op de markt met standaard producten waar je niet tegen op kan en wil. Een WordPress site is prima als je deze goed inricht. Het heeft geen enkel nut deze zelf te willen bouwen. Bouw je een site voor bijvoorbeeld een eigen bedrijf waar alleen je eigen werknemers op komen? Dan kan het wel weer prima. Kortom, de praktijk valt en staat met het doel dat je nastreeft.
Onderstaande code is dus bedoeld ter lering en vermaak. En bouw je voor een beperkt publiek waar allerlei andere veiligheidsmaatregelen omheen zijn genomen om ongewenste bezoekers buiten de deur te houden? Dan heb je hier een prima vertrekpunt. En oh ja, de opmaak is geen prio hier. Dus leef je daar lekker zelf uit. Een ander artikel gaat daar nog wel eens op in. Hier gaat het voor nu alleen om de techniek van het bouwen van PHP en MySQL.
Wat gaan we doen?
Het idee is om een login deel te maken waarop gepersonaliseerde informatie komt te staan. Deze gepersonaliseerde info hangt af van wie de gebruiker is en mogelijk welke rol deze gebruiker heeft binnen je omgeving. Simpel voorbeeld: een productiemedewerker heeft minder info nodig dan een productieleider. Om te zorgen dat je de juiste informatie deelt met de juiste personen, moeten we goed nadenken welke rollen er bestaan binnen onze omgeving.
Om de start omgeving te bouwen, moeten we een aantal pagina’s bouwen om deze werkend te krijgen. De volgende pagina’s hebben we alvast uitgedacht:
- Inlog formulier
- Database
- Ontvangst pagina waarop de gebruiker komt na inloggen
- Andere pagina’s aan de hand van rol die de gebruiker heeft
- Log uit pagina
Login pagina
De eerste pagina start met een formulier waarmee je kunt inloggen in het afgeschermde deel van je project. Deze pagina heet in ons project inlog.php en staat hieronder weergegeven.
<html>
<body>
<form method="post" action="verwerk-login.php">
<input type="text" name="gebruikersnaam" placeholder="Gebruikersnaam invoeren" required>
<input type="password" name="wachtwoord" placeholder="Wachtwoord invoeren" required>
<input type="submit" name="submit" value="Inloggen">
</form>
Deze pagina doet verder nog weinig. Als je dit formulier invoert, gebeurt er zogezegd geen donder. De verwerking van het formulier vindt plaats op de pagina verwerk-login.php waar de info wordt ontvangen.
MySQL Database
Om de site te kunnen laten werken heb je uiteraard een database nodig. Wij gebruiken MySQL. In het script gaan wij uit van een database met daarin een tabel met de naam tblusers. In deze tabel staan de volgende cellen: Id – INT (10) als unieke Id, gebruikersnaam VARCHAR (250) en password VARCHAR(250). Dit is voor nu voldoende om verder mee te komen. We gaan er hier vanuit dat je al ervaring hebt met het maken van een database tabel en de juiste gegevens van de database in te voeren in PHP voor de connectie.
Verwerk-login.php
Nadat het formulier is ingevuld, komt de info terecht op de verwerk-login.php pagina. Op deze pagina ontvang je de ingevoerde data, check je deze en spiegel je het aan de database waarin de data staat opgeslagen. Komt deze goed uit, dan kom je terecht op het afgeschermde deel van je project. Let op: in de praktijk moet je je wachtwoord veilig opslaan in de database met een Hash functie. Deze mist hier nog! Ook moet je de ingevulde data nog beveiligen ter voorkoming van hacks. Het script werkt wel gewoon, maar is niet veilig voor een online project.
<?php
session_start();
if(!empty($_POST)){
if(isset($_POST['gebruikersnaam']) && isset($_POST['wachtwoord'])){
$verb = new mysqli("localhost", "root", "ww-database", "naamdatabase");
$stmt = $verb->prepare("SELECT * FROM tbluser Where gebruikersnaam = ? ");
$stmt->bind_param('s', $_POST['gebruikersnaam']);
$stmt->execute();
$result = $stmt->get_result();
$user = $result->fetch_object();
// check password en stel session in
if($_POST['wachtwoord'] === $user->password) {
$_SESSION['user_id'] = $user->Id;
header('location: index.php');
} else {
header('location: login.php');
}
}
} else {
header('location: login.php');
}
?>Kloppen de ingevulde gegevens, dan verwijst de pagina door naar de index.php pagina. Daar vind je het beveiligde deel van je site. Komt iemand zomaar uit de pagina verwerk-login.php dan verwijst de pagina automatisch terug naar login.php. De structuur van de if( ) statements zijn hier van groot belang om je script goed op te bouwen.
<?php
session_start();
if(!isset($_SESSION['user_id'])){
header("location: login.php");
}
?>
// info voor afgeschermde deel plaatsen
<h1>Welkom</h1>
<a href="loguit.php">Log uit</a>En tot slot heb je de uitlog.php pagina waar je de session vernietigt. Ook als je de browser sluit, zal de session vernietigen.
<?php
session_start();
// verwijder variabelen session
session_unset();
// verwijder de session
session_destroy();
header("location: login.php");
?>
Staat deze basis? Dan kunnen we de site gaan uitbreiden met rollen en andere specifieke eisen.