Bonjour,
J'utilise un serveur
gnump3d pour le streaming mp3, je vous renvoie d'ailleurs à
une présentation succinte du logiciel qui, comme son nom l'indique, est open-source.
Comment authentifier la connexion à gnump3d par login/password grâce à LAMP ?
et plus particulièrement ici apache-ssl, puisque c'est le serveur apache que j'utilise.
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
NB : Je pars du principe que vous avez :
* les logiciels suivants fonctionnels :
- gnump3d
- apache-ssl ( ou apache avec mod-ssl, mais alors vous devrez modifier vous-même en fonction de votre configuration)
- php (5 ?), mysql (5 ?), bref, le
LAMP, configuré et en état de marche.
* les connaissances suffisantes dans le maniement de LAMP, de mysql, du php.
Les thèmes possibles pour gnump3d sont dans /usr/share/gnump3d/
Le thème par défaut est Tabular, créé par l'auteur de gnump3d, c'est celui ci que j'ai choisi d'utiliser.
Le fichier de configuration de serveur est /etc/gnump3d/gnump3d.conf
Le fichier que l'on va devoir modifer en particulier est l'exécutable, dans lequel le serveur boucle en attente de tentative de connexion, soit :
/usr/bin/gnump3d.
----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
Il faut savoir qu'à chaque tentative de connexion, le serveur lit son fichier de conf, ou se rappelle ce qu'il a lu en démarrant ( à voir ), à la recherche de la directive :
allowed_clients = 192.168.1.100 et
denied_clients = .
On laisse donc ce mode d'authentification par défaut, au lieu d'opter dans ce fichier pour la reconnaissance par password, et on va s'occuper plus tard de modifier le script perl.
Attention : Faîtes une sauvegarde de /usr/bin/gnump3d avant tout bidouillage de ce fichier ... c'est lui le pivot central.
Remarque : Ici, à priori, je n'autorise que mon poste, en local, à acceder au serveur par le port 8888, que j'ai laissé par défaut (gnump3d.conf).
/usr/bin/gnump3d :
Quand gnump3d reçoit la requête d'un navigateur, il fait un test sur l'adresse IP du visiteur
Citation:
#
# Make sure the user is actually allowed to talk to us
# this works by comparing the client address to those addresses
# given in 'allowed_clients', and 'denied_clients'.
#
if ( &bannedAddress( $connected_address ) )
{ ... }
en appelant une fonction
sub bannedAddress ( $ ) qui prend en paramètre l'ip du client, et qui la compare aux adresses autorisées et bannies de gnump3d.conf. Cette fonction renvoie donc vrai ou faux, vrai pour bannie. C'est ce bloc de code qui est à modifier légèrement, ainsi que la fonction.
Il se produit que si l'adresse est bannie, le serveur, au lieu d'ouvrir la page d'index.html du thème (Tabular), va ouvrir une page d'erreur :
"vous n'êtes pas autorisé ... etc .." par appel de ceci :
Code:
my $header = &getHTTPHeader( 200, "text/html" );
&sendData( $data, $header );
my $text = &getErrorPage( $ARGUMENTS{'theme'},
$literals->get( "ACCESS_DENIED" ) );
&sendData( $data, $text );
On peut donc :
- créer une nouvelle variable que j'appelle $loginpath
- la placer en tête du fichier script (plutot avec les autre variable my $var) déclarées en début de fichier.
- lui affecter une valeur qui sera, pour faire simple :
"<script language='javascript' type='text/javascript'>document.location.href='https://mondomaine.com/login.html';</script>"
NB: le fichier html est à la racine de DocumentRoot, mais on aurait pu le placer dans un repertoire caché de celui-ci, ce qui soulève toutefois un léger probleme, le visiteur connecté à la page de login pourrait remonter, en faisant un saut en arrière dans la barre du navigateur, dans l'arborescence d'apache, ce qui n'est pas l'idéal ... c'est pourquoi je n'entre pas dans ces détails.
On peut donc modifier le test ci-dessus en remplacant la variable
$text par
$loginpath. Ce qui va, à l'ouverture de la page d'erreur théorique, déclencher l'exécution du script javascript et une redirection du visiteur vers le serveur apache et la page de login dédiée.
Voici le contenu du fichier
login.html que j'ai utilisé :
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
$META
<title>gnump3d :: Accueil - Login </title>
<link rel="stylesheet" href="prefs.css" type="text/css">
<script language="javascript" type="text/javascript"><!--
function passation(){
document.inputForm.submit();
}
-->
</script>
</head>
<body>
<div id="banner">
<h1 align="center" >gnump3d Authentification</h1>
</div>
<ul id="tabmenu">
<li>
<a class="active" href="javascript:passation(this);" >Login
<script type="text/javascript" src="http://www.actulab.com/affiche-ip.php" language="JavaScript">
</script>
</a>
</li>
<li><a href="" >Music</a></li>
<li>
<form name="inputForm" action="login.php" method="post">
<table align="center">
<tr>
<td>
<span style="font-family: Bookman Old Style;
font-weight: bold ; font-size: 10pt ;color: #400080 ;
font-style: italic ;">login :
</span>
<input type="text" name="login" size=15 />
</td>
<td>
<span style="font-family: Bookman Old Style;
font-weight: bold ;font-size: 10pt ;color: #400080 ;
font-style: italic ;">pass :
</span>
<input type="password" name="pass" size=15 />
</td>
</tr>
<tr>
<td>
<div id="arriere" ><img alt="" src="Splash-Debian_red.png" />
<p align="left"><b> Ecouter de la musique par streaming avec gnump3d</b></p>
</div>
</td>
</tr>
</table>
</form>
</li>
</ul>
</body>
</html>
Quelques remarques : -
<link rel="stylesheet" href="prefs.css" type="text/css"> se réfère à une feuille de style que j'ai placée à côté de login.html, sous apache donc, et qui n'est q'une copie un peu modifiée de la feuille de style prefs.css dans le repertoire du thème de gnump3d. Voici sont contenu à titre purement indicatif, car ça me demanderait des connaissances en html et css que je n'ai pas, pour en faire une version qui tient la route :
Citation:
body {
margin: 0;
padding: 0;
background: #CACCB4;
font: 1em/1.7em arial, sans-serif;
}
pre {
text-indent: 30px;
}
#banner {
position: absolute;
top: 0;
left: 0;
height:40px;
width: 99%;
padding: 0;
margin: 0 1px;
border: 4px solid black;
color: black;
background: #ABAD85;
z-index: 5;
}
body>#banner {
position:
fixed;
}
#banner h1 {
margin: 0;
padding: 5px;
}
#tabmenu {
color: #000;
position: absolute;
top: 52px;
padding: 0px;
z-index: 10;
margin-left: 15px;
}
body>#tabmenu {
position: fixed; top: 34px;
}
head:first-child+body #tabmenu {
top: 36px;
} /*only mozilla*/
#tabmenu li {
display: inline;
overflow: hidden;
list-style-type: none;
}
#tabmenu a {
color: #DEDECF;
background: #898B5E;
font-size: 0.8em;
font-weight: bold;
border: 3px solid black;
padding: 2px;
margin: 2px;
text-decoration: none;
}
#tabmenu a.active {
color: #000000;
background: #FFAD85;
border-top: 3px solid #ABAD85;
z-index: 30;
}
#content tr:hover {background: #ADC09F;}
#tabmenu a:visited {color: #E8E9BE;}
#tabmenu a.active:hover {
background: #000000; //ABAD85;
color: #D3DBCB;
}
#tabmenu a:hover {
background: #ABAD85;
color: #D3DBCB;
}
#content {
background: #CACCB4;
font: 0.8em "Trebuchet MS", arial, sans-serif;
height: auto;
text-align: justify;
padding: 100px 70px 0px 70px;
z-index: 0;
}
#content a {
text-decoration: none;
color: #86862D;
}
#content a:hover {background: #ADC09F;}
#arriere {
position: absolute; /* dimension et positionnement du bloc conteneur de l'image */
left: 14em;
top: 5em;
height : 20em;
width : 30em;
}
#arriere img {
/* l'image occupe toute la place de son bloc conteneur */
width : 75%;
height: 75%;
}
#arriere p {
font-family: Bookman Old Style;
font-size: 10pt ;
color: #400080 ;
font-style: italic ;
}
Je serai même ravi que quelqu'un se propose d'en faire une correcte, qui gère bien les balises, l'affichage de l'image centrée dans la feuille, avec les champs de formulaire bien cadrés au dessus, le tout quelquesoit le navigateur utilisé ... (car ici, c'est cadré pour firefox, sur mozilla, c'est décalé ...).
-
<script type="text/javascript" src="http://www.actulab.com/affiche-ip.php" language="JavaScript"> est un petit script trouvé sur le net, qui affiche votre adresse IP dans l'onglet à côté de Login. C'est accéssoire, et pas forcément judicieux, j'imagine que si le site actulab est indisponible, ça pourrait faire planter la page ....
- Splash-Debian_red.png est une jolie image de Debian trouvée sur mon DD ...

- Quant à
passation (), elle va soumettre le login/password à un fichier de même niveau :
login.php Voici son contenu :
Code:
<html><body>
<?php
include_once 'mes_fonctions.php';
// Fonction de connexion à la base de données
connexion_DB('www_users');
// Exécute une requète SQL. Si la requête ne passe pas, renvoir le message d'erreur MySQL
// Paramètres : chaine SQL -> $strSQL
// Renvoie : enregistrements correspondants -> $result
if(isset($_POST) && !empty($_POST['login']) && !empty($_POST['pass'])) {
extract($_POST);
// on recupère le password de la table qui correspond au login du visiteur
$sql = "select pwd from private_members where login='".$_POST['login']."'";
$req = requete_SQL($sql); //or die('Erreur SQL !<br>'.$sql.'<br>'.mysql_error());
$data = mysql_fetch_assoc($req);
if($data['pwd'] != $pass) {
echo '<p>Mauvais login / password. Merci de recommencer</p>';
exit;
}
else {
$ip = $_SERVER["REMOTE_ADDR"];
exec("echo $ip >> /var/music/logins");
}
}
else {
echo '<p>Vous avez oublié de remplir un champ.</p>';
exit;
}
?>
<script language="javascript" type="text/javascript">
<!-- // si on arrive ici, le visiteur est identifié et autorisé, redirige vers gnump3d
window.location.replace("http://mondomaine.com:8888");
-->
</script>
</body></html>
Explications : On demande à php de lire un fichier de même niveau (./mes_fonctions.php) contenant entre autre une fonction de connexion à la base de données des utilisateurs autorisées, et une fonction de requête. Je vous invite à utiliser comme moi celui fourni par un bon tutoriel de développez.com :
Exemple de conception d'un site dynamique.
NB :
- $user sera le nom de l'utilisateur root ou admin que vous avez désigné comme administrateur de mysql.
- $pass ne doit pas rester vide, mettez y le password en clair (oui ennuyeux ...).
- l'énoncé de la requête sql est à adapter en fonction des noms du champ
et de la base de données chez vous biensur.
- les instructions exit; en cas d'erreur d'authentification entrainent la fin d'interprétation du fichier, et donc permettent d'ignorer la dernière instruction javascript que j'y place ...
- cette ultime intruction n'est lue que si l'utilisateur est authentifié, elle a pour effet de rediriger l'utilisateur vers gnump3d, en page d'accueil, ce qui va être l'occasion pour le serveur de faire un nouveau test afin de savoir si cet utilisateur (son ip) est autorisé par gnump3d à visiter le site.
On va faire en sorte qu'il le soit, maintenant. C'est plutot simple, plus haut, on a demander à php d'ajouter l'ip du visiteur dans un fichier situé par exemple dans l'arborescence de gnump3d :
Code:
$ip = $_SERVER["REMOTE_ADDR"];
exec("echo $ip >> /var/music/logins");
Il faut veiller à ce que php aie les droits suffisants pour écrire dans ce fichier.
Il reste donc à modifier la fonction
sub bannedAddress( $ ) dans /usr/bin/gnump3d pour lui demander de rajouter les addresses contenues dans logins à la collection ou tableau d'addresses qu'il va lire pour authentification de l'ip client.... Comme ceci, en deux temps :
1/ Lecture du fichier, enregistrement des lignes dans un tableau @lignes
Code:
open(TEXT, "</var/music/logins") || die "Erreur survenue: $!";
# Lit le fichier d'authentification.
my @lignes = <TEXT>; # recueille les lignes=IP dans un tableau
close(TEXT);
2/ Ajout de @lignes au tableau @good (liste des ip allowed) Code:
@good = ( @good , @lignes );
ceci venant juste aprés que gnump3d aie traité comme il se doit son fichier de conf, soit aprés l'instruction :
Code:
my @good = split( /;/, $allow );
my @bad = split( /;/, $deny );
Ainsi, l'ip client tout à l'heure refusée va être maintenant autorisée, et gnump3d ouvre la page d'index.html du thème, laissant accès à la lecture des répertoire de /var/music, pour le plaisir, normalement, du visiteur...
Parmis les nombreuses modifications et améliorations qui pourraient être apportées à cette façon de faire, je vois entre autre :
- l'écriture du mot de pass admin de mysql en clair dans un fichier, qui me chagrine ....
- les défauts de la feuille css de login.html que j'utilise, et qui, bien que trés inspirée de l'originale de Steve Kemp, en font par les modifications apportées, une feuille de piètre conception... je vous demande de m'en excuser, c'était juste pour l'exemple ....
- login.php, plutôt que de se contenter de simples exit, il vaudrait mieux rediriger l'user vers cette page à nouveau vierge, du moins avec un reset des champs à blanc.
- l'absence de processus d'éffacement du fichier /var/music/logins, si on en voit l'utilité, passé un certain délai.
- Et quelques autres peut-être, relatifs à la sécurité, mais qui restent à tester, je vous fais confiance pour le dire si c'est le cas, moi je n'en ai pas vraiment conscience ...
Voilà ... j'espère n'avoir rien oublié ... et zou
