Tutorials

member systeem

Met deze tutorial kan je een wat moeilijker members systeem maken.

Pagina 1

Database maken

Natuurlijk moeten we beginnen met onze database aan te maken. Als naam zal ik 'login' gebruiken. We zullen de tabel maken met behulp van PHP. Onze eerste bestand noemt 'data.inc'. Daarin zullen we de hostnaam, de gebruikersnaam en het wachtwoord van onze database in opslaan. Ook voegen we de naam van de site toe zodat we die later altijd kunnen gebruiken.
Het bestandje ziet er zo uit:

data.inc
<?php
$hostname = "mijn_hostname";
$username = "mijn_username";
$password = "mijn_password";
$db = "login";
$site_name = "www.mijnsite.com";
?>

De variabelen moet u natuurlijk aanpassen aan uw eigen instellingen.

Dit bestand importeren we met de include() - functie in het bestand om de tabel aan te maken:

make_table_members.php
<?php
include("data.inc");
$global_dbh = mysql_connect($hostname, $username, $password);
mysql_select_db($db, $global_dbh);
$query = "CREATE TABLE members (
ID int not null auto_increment primary key,
Gebruikersnaam varchar(30),
Wachtwoord varchar(30),
Email varchar(50)
)";
$result_id = mysql_query($query);
if($result_id)
{
print("Table created!");
}
?>

Onze database en onze tabel zijn gemaakt. Op naar de volgende stap!
Pagina 2

Het inlog-bestand

Het inlog-bestand ziet er zo uit:

login.php
<html>
<head>
<title>Inloggen in uw controlepaneel</title>
<style type="text/css">
<!--
table { border-style: solid;
border-width: 2px 2px;
border-color: #8182FE;
width: 100%;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 75%;
border-collapse: collapse;
}
th { background-color: #BFBFFF;
padding: 5px 5px 5px 5px;
color: #FFFFFF;
width: 50%;
text-align: center;
}
td { background-color: #E3E3FF;
padding: 5px 30px 5px 10px;;
width: 50%;
}
A:link { color: red;
text-decoration: none;
}
A:visited { color: red;
text-decoration: none;
}
A:hover { color: red;
text-decoration: underline;
}
A:active { color: red;
text-decoration: underline;
}
.help { font-size: 75%;
color: #000000;
font-weight: normal;
}
-->
</style>
</head>
<body>
<form method="post" action="controlpanel.php">
<table>
<tr>
<th colspan="2">INLOGGEN <span class="help">[<a href="register.php">Registreren</a>]</span></th>
</tr>
<tr>
<td align="right">Gebruikersnaam</td>
<td><input type="text" name="gebruikersnaam" size="20" />
</tr>
<tr>
<td align="right">Wachtwoord</td>
<td><input type="password" name="wachtwoord" size="20" />
<span class="help">[<a href="lostpass.php">Wachtwoord vergeten</a>]</span></td>
</tr>
<tr>
<th colspan="2"><input type="hidden" name="hidden" value="1" />
<input type="submit" value="Inloggen" /></th>
</tr>
</table>
</form>
</body>
</html>

Zoals je ziet zijn er ook 2 linken indien je je wachtwoord vergeten bent en om te registreren.
Pagina 3

Database maken

Natuurlijk moeten we beginnen met onze database aan te maken. Als naam zal ik 'login' gebruiken. We zullen de tabel maken met behulp van PHP. Onze eerste bestand noemt 'data.inc'. Daarin zullen we de hostnaam, de gebruikersnaam en het wachtwoord van onze database in opslaan. Ook voegen we de naam van de site toe zodat we die later altijd kunnen gebruiken.
Het bestandje ziet er zo uit:

data.inc
<?php
$hostname = "mijn_hostname";
$username = "mijn_username";
$password = "mijn_password";
$db = "login";
$site_name = "www.mijnsite.com";
?>

De variabelen moet u natuurlijk aanpassen aan uw eigen instellingen.

Dit bestand importeren we met de include() - functie in het bestand om de tabel aan te maken:

make_table_members.php
<?php
include("data.inc");
$global_dbh = mysql_connect($hostname, $username, $password);
mysql_select_db($db, $global_dbh);
$query = "CREATE TABLE members (
ID int not null auto_increment primary key,
Gebruikersnaam varchar(30),
Wachtwoord varchar(30),
Email varchar(50)
)";
$result_id = mysql_query($query);
if($result_id)
{
print("Table created!");
}
?>

Onze database en onze tabel zijn gemaakt. Op naar de volgende stap!
Pagina 4

Het inlog-bestand

Het inlog-bestand ziet er zo uit:

login.php
<html>
<head>
<title>Inloggen in uw controlepaneel</title>
<style type="text/css">
<!--
table { border-style: solid;
border-width: 2px 2px;
border-color: #8182FE;
width: 100%;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 75%;
border-collapse: collapse;
}
th { background-color: #BFBFFF;
padding: 5px 5px 5px 5px;
color: #FFFFFF;
width: 50%;
text-align: center;
}
td { background-color: #E3E3FF;
padding: 5px 30px 5px 10px;;
width: 50%;
}
A:link { color: red;
text-decoration: none;
}
A:visited { color: red;
text-decoration: none;
}
A:hover { color: red;
text-decoration: underline;
}
A:active { color: red;
text-decoration: underline;
}
.help { font-size: 75%;
color: #000000;
font-weight: normal;
}
-->
</style>
</head>
<body>
<form method="post" action="afterlogin.php">
<table>
<tr>
<th colspan="2">INLOGGEN <span class="help">[<a href="register.php">Registreren</a>]</span></th>
</tr>
<tr>
<td align="right">Gebruikersnaam</td>
<td><input type="text" name="gebruikersnaam" size="20" />
</tr>
<tr>
<td align="right">Wachtwoord</td>
<td><input type="password" name="wachtwoord" size="20" />
<span class="help">[<a href="lostpass.php">Wachtwoord vergeten</a>]</span></td>
</tr>
<tr>
<th colspan="2"><input type="hidden" name="hidden" value="1" />
<input type="submit" value="Inloggen" /></th>
</tr>
</table>
</form>
</body>
</html>

Zoals je ziet is de opmaak al verzorgd. Er zijn ook 2 linken naar pagina's om te registreren en indien je je wachtwoord vergeten bent.
Pagina 5

login-verwerking

Met dit bestand wordt de login verwerkt:

afterlogin.php
<?php
session_start();
include("data.inc");
$global_dbh = mysql_connect($hostname, $username, $password);
mysql_select_db($db, $global_dbh);
$test_gebruikersnaam = $_POST[gebruikersnaam];
$test_wachtwoord = $_POST[wachtwoord];
$query = "SELECT Wachtwoord FROM members WHERE Gebruikersnaam = '$test_gebruikersnaam'";
$result_id = mysql_query($query) or die(mysql_error($query));
$row = mysql_fetch_row($result_id);
$db_wachtwoord = $row[0];

// ************************** Correcte login *******************

if($test_gebruikersnaam != "" && $test_wachtwoord != "" && $test_wachtwoord == $db_wachtwoord)
{
$_SESSION['user'] = "$test_gebruikersnaam";
?>

<html>
<head>
<title>Uw controlepaneel</title>
</head>
<body>
<a href="secured_by_session.php">Ga verder</a>
</body>
</html>

<?php
}

// *************************** Foute login via loginscherm ************************

elseif($_POST[hidden] == 1)
{
?>

<html>
<head>
<title>Foute login</title>
<style type="text/css">
<!--
td.error { color: red;
text-align: center;
font-size: 12;
font-weight: bold;
background-color: #FEFD9A;
}

-->
</style>
</head>
<body>
<table>
<tr>
<td class="error">Foute gebruikersnaam of wachtwoord!</td>
</tr>
</table>
<?php
include("login.php");
?>
</body>
</html>

<?php
}

// *************************** Via link ************************

else
{
?>

<html>
<head>
<title>Eerst inloggen</title>
<style type="text/css">
<!--
td.error { color: red;
text-align: center;
font-size: 12;
font-weight: bold;
background-color: #FEFD9A;
}

-->
</style>
</head>
<body>
<table>
<tr>
<td class="error">U moet eerst inloggen!</error></td>
</tr>
</table>
<?php
include("login.php");
?>
</body>
</html>

<?php
}
?>
Pagina 6

Wachtwoord vergeten

Dit is het bestand die een e-mail stuurt met uw gegevens indien je je wachtwoord vergeten bent.

lostpass.php
<html>
<head>
<title>Wachtwoord vergeten</title>
<style type="text/css">
<!--
table { border-style: solid;
border-width: 2px 2px;
border-color: #8182FE;
width: 100%;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 75%;
border-collapse: collapse;
}
th { background-color: #BFBFFF;
padding: 5px 5px 5px 5px;
color: #FFFFFF;
width: 50%;
text-align: center;
}
td { background-color: #E3E3FF;
padding: 5px 30px 5px 10px;;
width: 50%;
}
A:link { color: red;
text-decoration: none;
}
A:visited { color: #ffffff;
text-decoration: underline;
}
A:hover { color: red;
text-decoration: underline;
}
A:active { color: red;
text-decoration: underline;
}

-->
</style>
</head>
<body>
<form method="post" action="lostpass_send.php">
<table>
<tr>
<th colspan="2">WACHTWOORD VERGETEN</th>
</tr>
<tr>
<td align="right">Gebruikersnaam</td>
<td><input type="text" name="gebruikersnaam" size="20" />
</tr>
<tr>
<td align="right">Email</td>
<td><input type="text" name="email" size="30" /></td>
</tr>
<tr>
<input type="hidden" name="hidden" value="1" />
<th colspan="2"><input type="submit" value="Verzenden" /></th>
</tr>

</table>
</form>
</body>
</html>
Pagina 7

Verwerking wachtwoord vergeten

lostpass_send.php
<?php
include("data.inc");
$global_dbh = mysql_connect($hostname, $username, $password);
mysql_select_db($db, $global_dbh);
$test_gebruikersnaam = $_POST[gebruikersnaam];
$test_email = $_POST[email];
$query = "SELECT * FROM members WHERE Gebruikersnaam = '$test_gebruikersnaam'";
$result_id = mysql_query($query) or die(mysql_error($query));
$row = mysql_fetch_row($result_id);
$db_email = $row[3];
$wachtwoord = $row[2];

// **************** Correcte data *********************

if($test_gebruikersnaam != "" && $test_email != "" && $test_email == $db_email)
{
$mailsend = mail($test_email, "Uw wachtwoord bij $site_name", "Hallo $test_gebruikersnaam!\n\nUw wachtwoord: $wachtwoord\n\n\nDe webmaster");
?>

<html>
<head>
<title>E-mail verzonden -- Login</title>
<style type="text/css">
<!--
td.error { color: red;
text-align: center;
font-size: 12;
font-weight: bold;
background-color: #FEFD9A;
}

-->
</style>
</head>
<body>
<table>
<tr>
<td class="error">

<?php
if($mailsend)
{
print("Er is naar u een e-mail verzonden met het gevraagde wachtwoord.");
}
else
{
print("E-mail verzenden is mislukt. Probeer later opnieuw!");
}
?>

</td>
</tr>
</table>
<?php
include("login.php");
?>
</body>
</html>

<?php
}

// *************************** Foute data ************************

elseif($_POST[hidden] == 1)
{
?>

<html>
<head>
<title>Foute informatie</title>
<style type="text/css">
<!--
td.error { color: red;
text-align: center;
font-size: 12;
font-weight: bold;
background-color: #FEFD9A;
}

-->
</style>
</head>
<body>
<table>
<tr>
<td class="error">Foute gebruikersnaam of e-mailadres!</td>
</tr>
</table>
<?php
include("lostpass.php");
?>
</body>
</html>




<?php
}

// *************************** Rechstreekse login ************************

else
{
?>


<html>
<head>
<title>Eerst inloggen</title>
<style type="text/css">
<!--
td.error { color: red;
text-align: center;
font-size: 12;
font-weight: bold;
background-color: #FEFD9A;
}

-->
</style>
</head>
<body>
<table>
<tr>
<td class="error">U moet eerst inloggen!</error></td>
</tr>
</table>
<?php
include("login.php");
?>
</body>
</html>

<?php
}
?>
Pagina 8

Registreren

register.php
<?php
include("data.inc");
$global_dbh = mysql_connect($hostname, $username, $password);
mysql_select_db($db, $global_dbh);
?>
<html>
<head>
<title>Registreren</title>
<style type="text/css">
<!--
table { border-style: solid;
border-width: 2px 2px;
border-color: #8182FE;
width: 100%;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 75%;
border-collapse: collapse;
}
th { background-color: #BFBFFF;
padding: 5px 5px 5px 5px;
color: #FFFFFF;
width: 50%;
text-align: center;
}
td { background-color: #E3E3FF;
padding: 5px 30px 5px 10px;;
width: 50%;
}
A:link { color: red;
text-decoration: none;
}
A:visited { color: red;
text-decoration: none;
}
A:hover { color: red;
text-decoration: underline;
}
A:active { color: red;
text-decoration: underline;
}
.help { font-size: 75%;
color: #000000;
font-weight: normal;
}
td.error { color: red;
text-align: center;
font-size: 12;
font-weight: bold;
background-color: #FEFD9A;
}

-->
</style>
</head>
<body>

<?php

// *********************** Stage 1 **********************

if(!IsSet($_POST['stage']))
{
?>

<form method="post" action="<?php print($PHP_SELF); ?>">
<table>
<tr>
<th colspan="2">REGISTREREN</th>
</tr>
<tr>
<td align="right">Gebruikersnaam</td>
<td><input type="text" name="gebruikersnaam" size="20" maxlength="30" />
</tr>
<tr>
<td align="right">Wachtwoord</td>
<td><input type="password" name="wachtwoord" size="20" maxlength="30" /></td>
</tr>
<tr>
<td align="right">E-mailadres</td>
<td><input type="text" name="email" size="40" maxlength="50" /></td>
<tr>
<th colspan="2"><input type="hidden" name="stage" value="2" />
<input type="submit" value="Registreren" /></th>
</tr>
</table>
</form>

<?php
}

// *********************** Stage 2 ***************************

elseif($_POST['stage'] == 2)
{

// ****************** Alle velden zijn ingevuld *********************

if($_POST['gebruikersnaam'] != "" && $_POST['wachtwoord'] != "" && $_POST['email'] != "")
{
$query_1 = "SELECT * FROM members WHERE Gebruikersnaam = '$_POST[gebruikersnaam]'";
$result_id_1 = mysql_query($query_1) or die(mysql_error($query_1));
$row = mysql_num_rows($result_id_1);

// ************************** Nog niet gebruikte gebruikersnaam ********************

if($row == 0)
{
$query_2 = "INSERT INTO members (Gebruikersnaam, Wachtwoord, Email) values ('$_POST[gebruikersnaam]', '$_POST[wachtwoord]', '$_POST[email]')";
$result_id_2 = mysql_query($query_2) or die(mysql_query($query_2));
$mailsend = mail($_POST[email], "Uw registratiegegevens bij $site_name", "Hallo $_POST[gebruikersnaam]!\n\nBedankt dat u geregistreerd hebt bij ons!\n\nUw gebruikersnaam: $_POST[gebruikersnaam]\nUw wachtwoord: $_POST[wachtwoord]\n\n\nDe webmaster");
?>

<table>
<tr>
<td class="error">

<?php
if($mailsend && $result_id_2)
{
print("Uw gegevens zijn opgeslagen in onze database en er is naar u een e-mail verzonden met deze gegevens. U kunt nu inloggen!");
}
else
{
print("Gegevens opslaan of e-mail verzenden is mislukt. Probeer het later opnieuw!");
}
?>

</td>
</tr>
</table>
<?php
include("login.php");
}
// ***************************** Al gebruikte gebruikersnaam *********************

else
{
?>

<table>
<tr>
<td class="error">Deze gebruikersnaam is reeds in gebruik. Probeer een andere!</error></td>
</tr>
</table>
<form method="post" action="<?php print($PHP_SELF); ?>">
<table>
<tr>
<th colspan="2">REGISTREREN</th>
</tr>
<tr>
<td align="right">Gebruikersnaam</td>
<td><input type="text" name="gebruikersnaam" size="20" maxlength="30" />
</tr>
<tr>
<td align="right">Wachtwoord</td>
<td><input type="password" name="wachtwoord" size="20" maxlength="30" /></td>
</tr>
<tr>
<td align="right">E-mailadres</td>
<td><input type="text" name="email" size="40" maxlength="50" /></td>
<tr>
<th colspan="2"><input type="hidden" name="stage" value="2" />
<input type="submit" value="Registreren" /></th>
</tr>
</table>
</form>
<?php
}
}

// ******************* Niet alle velden zijn ingevuld **********************

else
{
?>
<table>
<tr>
<td class="error">U moet alle velden invullen!</error></td>
</tr>
</table>
<form method="post" action="<?php print($PHP_SELF); ?>">
<table>
<tr>
<th colspan="2">REGISTREREN</th>
</tr>
<tr>
<td align="right">Gebruikersnaam</td>
<td><input type="text" name="gebruikersnaam" size="20" maxlength="30" />
</tr>
<tr>
<td align="right">Wachtwoord</td>
<td><input type="password" name="wachtwoord" size="20" maxlength="30" /></td>
</tr>
<tr>
<td align="right">E-mailadres</td>
<td><input type="text" name="email" size="40" maxlength="50" /></td>
<tr>
<th colspan="2"><input type="hidden" name="stage" value="2" />
<input type="submit" value="Registreren" /></th>
</tr>
</table>
</form>
<?php
}
}
?>

</body>
</html>
Pagina 9

Pagina's die beveiligd zijn door de sessie

secured_by_session.php
<?php
session_start();
if(!IsSet($_SESSION['user']))
{
?>

<html>
<head>
<title>Eerst inloggen</title>
<style type="text/css">
<!--
td.error { color: red;
text-align: center;
font-size: 12;
font-weight: bold;
background-color: #FEFD9A;
}

-->
</style>
</head>
<body>
<table>
<tr>
<td class="error">U moet eerst inloggen!</error></td>
</tr>
</table>
<?php
include("login.php");
?>
</body>
</html>

<?php
}
else
{
print("U bent ingelogd als " . $_SESSION['user'] . ".");
}
?>
Pagina 10

Einde

Dit is het einde van deze tutorial. Ik hoop dat je er wat aan hebt. Heb je vragen of opmerkingen ... reageer alvast!

Reacties

0
Nog geen reacties.