CodeS-SourceS est hébergé par Frontier.fr

Ce site au démarrage

begin process at 2012 02 04 23:01:18

Accueil Codes Tutoriels Forum Livres Emploi Services Connexion

Trouver un code source :

dans

[ Dernières recherches ]

Accueil >

Application

> XAMP : EXEMPLE DE SCRIPT D'IDENTIFICATION SIMPLE

XAMP : EXEMPLE DE SCRIPT D'IDENTIFICATION SIMPLE

Information sur la source

Note :

10,00 / 10

Catégorie :Application Classé sous :ajax, php, mysql, xhtml, login Niveau :Initié Date de création :29/07/2006 Date de mise à jour :29/07/2006 20:32:57 Vu / téléchargé :32 494 / 14 409

Auteur : roddd

Ecrire un message privé

Commentaire sur cette source (10)

Ajouter un commentaire et/ou une note

Description

XAMP est un acronyme qui désigne le regroupement des technologies destinées à la gestion de contenu WEB suivantes :

- Xhtml pour le balisage du contenu
- Ajax pour la manipulation des requêtes asynchrones ( sans recharger la page )
- MySQL pour le stockage des données
- PhP pour le traitement des requêtes et la communication avec la base de données MySQL

À l'aide d'un script d'identification de base, j'espères vous faire découvrir le potentiel de cette technologie de développement de solutions WEB et vous inciter à aller de l'avant dans l'apprentissage de cette nouvelle méthode de travail :)

== Précisions ==

Avec les requêtes de type XMLHttpRequest, JavaScript vous permet de repousser les limites de la présentation traditionnelle du contenu en traitant les requêtes en "background" sans avoir besoin de recharger la page. Cette technologie, couplée à un language de script comme PHP et à une base de donnée vous permet de développement des applications en ligne qui allient les avantages du WEB à l'ergonomie des applications logicielles. Une fois maîtrisée, la technologie XAMP vous permet de gérer "en temps réel" des paramêtres fournis par l'utilisateur et ainsi faciliter la prise en main de vos interfaces WEB.

Source

[Partie PHP]
<?php
# CONFIGURATION
$CONFIG['host'] = "localhost";
$CONFIG['name'] = "Nom de la base de données";
$CONFIG['user'] = "Utilisateur";
$CONFIG['pass'] = "Mot de passe";
# IDENTIFICATION
$connection = null;
$result = null;
$user = null;
$password = null;
$username = null;
if ( isset( $_GET['username'] ) && $_GET['username'] != "" && isset( $_GET['password'] ) && $_GET['password'] != "" )
{
$username = trim( addslashes( $_GET['username'] ) );
$password = md5( trim( addslashes( $_GET['password'] ) ) );
$connection = @mysql_connect( $CONFIG['host'], $CONFIG['user'], $CONFIG['pass'] );
if( $connection != null && $connection )
{
if ( @mysql_select_db( $CONFIG['name'], $connection ) )
{
$result = mysql_query("SELECT * FROM users WHERE user_name = '".$username."' ");
if ( $result != null && $result && !empty( $result ) )
{
$user = mysql_fetch_assoc( $result );
if ( $user != null && $user && !empty( $user ) )
{
if ( $password == $user['user_password'] )
{
print "good";
} else {
print "wrong";
}
} else {
print "Aucun compte n'est associé a ce nom d'utilisateur !";
}
} else {
print "Veuillez exécuter la routine d'installation avant de tester ce script !";
}
} else {
print "Impossible de sélectionner la base de donnée !";
}
} else {
print "Impossible de se connecter au serveur MySQL !";
}
} else{
print "Veuillez entrer un nom d'utilisateur et un mot de passe valide !";
}
?>
[Partie AJAX]
// Mise à jour du message destiné à l'utilisateur sans recharger la page
function update_status( text, img )
{
document.getElementById("message").innerHTML = '<img id="status" src="theme/' + img + '.gif"> ' + text;
}
// Manipulation de la requête d'identification de manière asynchrone
function handle_login()
{
var loginRequest = null;
update_status( "Votre requête est en cours de traitement ...", "handle");
// Définition du connecteur en fonction du navigateur :
if (window.XMLHttpRequest)
{
loginRequest = new XMLHttpRequest();
if (loginRequest.overrideMimeType)
{
loginRequest.overrideMimeType('text/xml');
}
}
else if (window.ActiveXObject)
{
try {
loginRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
loginRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {
update_status( "Impossible de communiquer avec le serveur", "handle");
}
}
}
// le secret d'AJAX réside en partie dans la réception et le traitement des résultats en background :
loginRequest.onreadystatechange = function()
{
update_status( "Veuillez patienter pendant le processus d'authentification ...", "busy");
if( loginRequest.readyState == 4 )
{
// Ici le code 200 signifie que la requête a renvoyé une valeur valide. On pourrait aussi gérer les erreurs 500, 404 ...
if( loginRequest.status == 200 )
{
if ( loginRequest.responseText == "good" )
{
update_status( "Identification réussie !" , loginRequest.responseText );
} else if ( loginRequest.responseText == "wrong" ) {
update_status( "Le mot de passe est erroné !" , loginRequest.responseText );
} else {
update_status( loginRequest.responseText , "handle" );
}
}
else
{
update_status( "Une erreur est survenue : " + loginRequest.status + " " + loginRequest.statusText, "handle");
}
}
};
username = document.getElementById('username').value;
password = document.getElementById('password').value;
// le secret d'AJAX réside également dans l'envoi de la requête en background ( sans recharger la page ) :
loginRequest.open("GET", "login.php?username=" + username + "&password=" + password, true);
loginRequest.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
loginRequest.send(null);
}
[Formulaire XHTML]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="fr">
<head>
<title>Exemple de système d'identification simple codé en XAMP</title>
<script src="login.js" type="text/javascript"></script>
<link type="text/css" href="theme/login.css" rel="stylesheet">
</head>
<body>
<div id="Header">
Exemple de système d'identification simple codé en XAMP ( xhtml, ajax, mysql et php )
</div>
<div id="LoginForm">
<form onSubmit="return false">
<p>
<label for="username">Nom d'utilisateur : </label>
<input type="text" name="username" id="username" size=20>
</p>
<p>
<label for="password">Mot de passe : </label>
<input type="password" name="password" id="password" size=20>
</p>
<input type="submit" name="submit" value="Login" onClick="handle_login();">
</form>
</div>
<div id="message" for="status">
<img id="status" src="theme/handle.gif">
Entrez votre nom d'utilisateur ainsi que votre mot de passe pour ouvrir une nouvelle session ...
</div>
</body>
</html>

[Partie PHP]

<?php

# CONFIGURATION

$CONFIG['host'] = "localhost";
$CONFIG['name'] = "Nom de la base de données";
$CONFIG['user'] = "Utilisateur";
$CONFIG['pass'] = "Mot de passe";

# IDENTIFICATION

$connection = null;
$result = null;
$user = null;
$password = null;
$username = null;

if ( isset( $_GET['username'] ) && $_GET['username'] != "" && isset( $_GET['password'] ) && $_GET['password'] != "" )
{
	$username = trim( addslashes( $_GET['username'] ) );
	$password = md5( trim( addslashes( $_GET['password'] ) ) );
	$connection = @mysql_connect( $CONFIG['host'], $CONFIG['user'], $CONFIG['pass'] );
	
	if( $connection != null && $connection )
	{
		if ( @mysql_select_db( $CONFIG['name'], $connection ) )
		{
			$result = mysql_query("SELECT * FROM users WHERE user_name = '".$username."'  ");
			if ( $result != null && $result && !empty( $result ) )
			{
				$user = mysql_fetch_assoc( $result );
				if ( $user != null && $user && !empty( $user ) )
				{
					if ( $password == $user['user_password'] )
					{
						print "good";
					} else {
						print "wrong";
					}
				} else {
					print "Aucun compte n'est associé a ce nom d'utilisateur !";
				}
			} else {
				print "Veuillez exécuter la routine d'installation avant de tester ce script !";
			}
		} else {
			print "Impossible de sélectionner la base de donnée !";
		}
	} else {
		print "Impossible de se connecter au serveur MySQL !";
	}
} else{
	print "Veuillez entrer un nom d'utilisateur et un mot de passe valide !";
}

?>


[Partie AJAX]


	// Mise à jour du message destiné à l'utilisateur sans recharger la page
	function update_status( text, img )
	{
		document.getElementById("message").innerHTML = '<img id="status" src="theme/' + img + '.gif"> ' + text;
	}
	
	// Manipulation de la requête d'identification de manière asynchrone
	function handle_login()
	{ 
		var loginRequest = null; 

		update_status( "Votre requête est en cours de traitement ...", "handle");
		
		// Définition du connecteur en fonction du navigateur :
		if (window.XMLHttpRequest)
		{
 			loginRequest = new XMLHttpRequest();
			if (loginRequest.overrideMimeType) 
			{
				loginRequest.overrideMimeType('text/xml');
			}
		} 
		else if (window.ActiveXObject) 
		{
			try {
				loginRequest = new ActiveXObject("Msxml2.XMLHTTP");
			} catch (e)	{
				try {
					loginRequest = new ActiveXObject("Microsoft.XMLHTTP");
				} catch (e) {
					update_status( "Impossible de communiquer avec le serveur", "handle");
				}
			}
        }
		
		// le secret d'AJAX réside en partie dans la réception et le traitement des résultats en background :
		loginRequest.onreadystatechange = function()
		{ 
			update_status( "Veuillez patienter pendant le processus d'authentification ...", "busy");
			if( loginRequest.readyState == 4 )
			{

				// Ici le code 200 signifie que la requête a renvoyé une valeur valide. On pourrait aussi gérer les erreurs 500, 404 ...
                                if( loginRequest.status == 200 )
				{
					if ( loginRequest.responseText == "good" )
					{
						update_status( "Identification réussie !" , loginRequest.responseText );
					} else if ( loginRequest.responseText == "wrong" )  {
						update_status( "Le mot de passe est erroné	 !" , loginRequest.responseText );
					} else {
						update_status( loginRequest.responseText , "handle" );
					}
				}
				else	
				{
					update_status( "Une erreur est survenue : " + loginRequest.status + " " + loginRequest.statusText, "handle");
				}	
			} 
		};
		
		username = document.getElementById('username').value;
		password = document.getElementById('password').value;
		
		// le secret d'AJAX réside également dans l'envoi de la requête en background ( sans recharger la page ) :
		loginRequest.open("GET", "login.php?username=" + username + "&password=" + password, true); 
		loginRequest.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 
		loginRequest.send(null); 
	}

[Formulaire XHTML]

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="fr">
	<head>
		<title>Exemple de système d'identification simple codé en XAMP</title>
		<script src="login.js" type="text/javascript"></script>
		<link type="text/css" href="theme/login.css" rel="stylesheet">
	</head>
	<body>
	<div id="Header">

		Exemple de système d'identification simple codé en XAMP ( xhtml, ajax, mysql et php )
	</div>
	<div id="LoginForm">
		<form onSubmit="return false">
			<p>
				<label for="username">Nom d'utilisateur : </label>
				<input type="text" name="username" id="username" size=20>	
			</p>
			<p>		
				<label for="password">Mot de passe : </label>

				<input type="password" name="password" id="password" size=20>
			</p>
			<input type="submit" name="submit" value="Login" onClick="handle_login();">
		</form>
	</div>
	<div id="message" for="status">
		<img id="status" src="theme/handle.gif">
		Entrez votre nom d'utilisateur ainsi que votre mot de passe pour ouvrir une nouvelle session ...
	</div>

	</body>
</html>

Conclusion

Ce script a été conçu dans le but express de vous apprendre les bases de la technologie XAMP et ne ne devrait en aucun cas être utilisé dans son état actuel pour des fins d'identification. Le code n'est pas entièrement commenté car le but n'est pas de vous donner des informations qui ne seraient pas entièrement exacts et conformes aux normes. Vous devez déjà posséder une certaine connaissance de base de chacune des technologies employées pour bien comprendre comment ce script fonctionne.

Fichier Zip

Les Membres Club peuvent télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !

index.html 1 109 octets
login.js 2 327 octets
login.php 1 543 octets
install
- mysql.txt 392 octets
- readme.txt 1 674 octets
theme
- busy.gif 294 octets
- good.gif 433 octets
- handle.gif 422 octets
- login.css 486 octets
- Thumbs.db11 776 octets
- wrong.gif 425 octets

Télécharger le zip

Historique

29 juillet 2006 08:40:39 :: J'ai rajouté quelques explications supplémentaires histoire d'expliquer un peu plus l'utilité de cette source
29 juillet 2006 08:58:23 :: Ajout du code principal
29 juillet 2006 20:32:57 :: Ajout du formulaire xhtml

Sources de la même categorie

IPHONE - ICÔNE D'APPEL TÉLÉPHONIQUE SUR L'ÉCRAN D'ACCUEIL par Rainbow

[APP WEB]SERVEUREXPLOREUR par thematrix01

MY.BOOKMARKS par inwebo

M.V.C M.E.D par faceme

MOTEUR DE RECHERCHE YOUTUBE API par mtrix000

Toutes les sources de la catégorie Application

Sources en rapport avec celle ci

EL COYOTOS LIVRE D'OR PHP 5 par elcoyotos

ORGANIGRAMME PHP DYNAMIQUE par megatom

ORGANIGRAMME DYNAMIQUE par lptt320

CHAT AJAX AVEC MYSQL QUASI COMPLET par bloom1

MINI LISTE GÉNÉRIQUE AFFICHANT UNE TABLE MYSQL ET PERMETTANT... par antoine129

Commentaires et avis

Commentaire de roddd le 29/07/2006 08:21:46

Il s'agit de ma première source donc soyez vigilants s'il vous plaît :D Les images, le code PHP, le design CSS et le traitement des requêtes proviennent tous de moi mais il se pourraît que la struture du moteur javascript ressemble aux tutoriels de base d'autres auteurs car la méthode de base est relativement similaire à ce niveau.

Commentaire de FhX le 29/07/2006 11:04:05

"loginRequest.open("GET", "login.php?username=" + username + "&password=" + password, true);"
J'aurais fait passer ca en POST moi perso !

Commentaire de roddd le 29/07/2006 15:03:09

Oui bien sûr mais ce script n'est qu'un exemple d'utilisation de la méthode XMLHttpRequest.open() ... pour faire passer la même requête mais en POST, il faut utiliser XMLHttpRequest.send() :p

Commentaire de kankrelune le 30/07/2006 00:50:11

En get aussi... sauf que tu ne transmet pas de parametres... .. .

XMLHttpRequest.send(null);

;oP

@ tchaOo°

Commentaire de roddd le 30/07/2006 08:40:12

Ouais enfin on se comprends, voilà ce que ça donne pour une requête POST :

# loginRequest.open("POST", "login.php", true);
# loginRequest.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
# loginRequest.send("username=" + username + "&password=" + password);

Commentaire de ImmortalPC le 30/07/2006 10:15:14

Salut,

question un peu c** c' est quoi la différance entre Ajax et JavaScript ??

@+

Commentaire de malalam le 30/07/2006 11:32:30 administrateur CS

Hello,

Ajax est une méthode de programmation, permettant, via javascript et un objet xmlhttp (activeX pour IE, chaque navigateur a -ou non - son implémentation) d'interroger une page sur le serveur et d'en recevoir la réponses de manière transparente pour l'utilisateur.
En gros.

Pour ce qui est du code, ça me parait assez dangereux d'utiliser Ajax pour une identification. Et assez inutile, à dire vrai.
De plus, xhtml strict implique qu'on ferme les balises, hein... : <input... />

Commentaire de roddd le 30/07/2006 14:36:20

Oui t'as raison Malalam, le code du formulaire est pas optimisé la honte :d En même temps le but de l'exercise était de présenter le XAMP et rien n'est optimisé ni en état de servir tel quel dans un réel script.

Sinon une fois optimisé avec un hash du champs "password" avant l'envoi de la requête POST je ne vois pas pourquoi ça ne pourrait pas convenir pour une identification convenable. Même des applications comme phpBB ne hash pas pas le mot de passe directement dans le formulaire ...

Et sinon l'identification XAMP permet entre autres choses d'insérer des formulaires de "réponse rapide a un topic" sans avoir à passer par une page de login.

Commentaire de VirtuAiles le 19/02/2008 01:06:09

Hmmph! C'est vieux!

Anyway... c'est moi qui est trop c** ou je ne vois pas c'est quoi le mot de pass?
Le nom d'utilisateur est "test" et le hash du mot de passe est "15161160009d76427791ebd5809ded7c" mais en clair, c'est quoi...?

Merci ;)

Commentaire de VirtuAiles le 19/02/2008 01:08:41

Bah, laissez tomber, j'ai trouvé en utilisant un decrypter ;)

Sinon, si jamais vous connaissez un script/tuto pour faire un script similaire, n'hésitez pas à partager hein :)

Ajouter un commentaire

Discussions en rapport avec ce code source dans le forum

problème avec MYSQL/php [ par spiesalex ] salut,bon j'ai ce code ci:<?phpif(isset($_POST['login']) Sessions permissions [ par Soul EX ] <?php session_start(); $login = $_POST["login"]; $password = $_POST["password"]; $connexion = mysql_connect("*","*","*"); mysql_select_db("*",$c Problème avec fichier de login pour espace membres [ par Florent06 ] Salut à tous !!! Je suis en train de faire un espace membres et voici ce qu'il y a dans le fichier de login (après la page de formulaire de probleme de session_start [ par metal_death ] Bonjour  j'ai créer un espace membre grace a phpfacile mais j'ai un petit probleme lors de la connection je recois ce message : Warning: se Authentification ie et firefox [ par mounelelabrador ] Bonjour, Je dois créer un site avec gestion membres, admins et vu que c'est pour un cours je ne peux pas vraiment télécharger sur inter AJAX PHP send var [ par cedriclomb ] Bonjour,Bon la j'y pige que couik !Alors voila le problème, je cherche a envoyer un fomulaire à PHP avec AJAX et une méthode POST, j'ai fait des reche problème avec requete sql et php [ par machmacha ] bonjour,j'ai une requête simple sur php la voilà:$sql = mysql_query("SELECT * FROM test WHERE login='".$_POST['log difference entre les majuscules et miniscules [ par faty86 ] bonjour,nous travaillons sur une application utilisant PHP/MYSQL. nous avons une table Profil (contenant les users) ayant comme champs: Login, PWD et a tous les pro du php [ par vrkill2 ] bonjour a tous qui peux mexpliqué clairement comment utiliser se code svp merci <?php // Démarage de la session PHP4// Il faut tou Bonsoir, un probleme avec mon codage [ par xavier62 ] Je vous montre mon problem sur un codage !! et sa m'écrit ceci : Warning: mysql_fetch_array(): supplied argument is not a valid MySQL result resourc

Nos sponsors

Derniers Blogs

CSS CONTENT STATE SELECTORS (PERSONNAL DRAFT) par FREMYCOMPANY

MBA : POURQUOI FAIRE ET COMMENT LE CHOISIR ? par ROMELARD Fabrice

Y'A DES ERREURS QUI PEUVENT RENDRE LE DéVELOPPEUR VIOLENT par Aleks

[HYPER-V 3] PRéSENTATION DES COMMANDLETS POWERSHELL par Pierrick CATRO-BROUILLET

IIS7 - COMPRESSION GZIP par cyril

Forum

RE : COMMENT CRéER COMPTE CLIENT INDIVIDUEL ? par NHenry

RE : ERREUR APACHE:500 INTERNAL SERVER ERROR par TychoBrahe

RE : PROBLEME DE ET RETOUR AUTOMATIQUE à LA PREMIERE OPTION par TychoBrahe

RE : COMMENT CRéER COMPTE CLIENT INDIVIDUEL ? par gero244

RE : COMMENT CRéER COMPTE CLIENT INDIVIDUEL ? par NHenry

Côté IT

Offres d'emploi

Formations Video

Appels d'offres

Cherche referenceur astucieux
Budget : 1 500€
Recherche expert advisor sous mql4 hedging
Budget : 200€
Creation boutique en ligne iphone- android - Republication.
Budget : 4 000€

Logiciels

Easy-Planning (1.0.0.1)
EASY-PLANNING (1.0.0.1)

Basé sur les mêmes principes que MyPlanning, Easy-Planning permet de créer des plannings sous la ...

Cliquez pour télécharger Easy-Planning
Academy System (17.1.3.0)
ACADEMY SYSTEM (17.1.3.0)

Logiciel de gestion des établissements. - élèves/étudiants (inscription, dossier, absence...) -...

Cliquez pour télécharger Academy System
COLLECTOR PLUS (3.00B)
COLLECTOR PLUS (3.00B)

COLLECTOR PLUS version 3.00B est un logiciel utilisant une base de données alimentée par : - L...

Cliquez pour télécharger COLLECTOR PLUS
PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO (V7.4)
PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO (V7.4)

PONAMEDIA TV DEVIENS HELLLOOO FLASH LA TV SUR VOTRE ORDINATEUR. Toute une plateforme Multi...

Cliquez pour télécharger PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO
LettresFaciles 2011 (8.0.0.1)
LETTRESFACILES 2011 (8.0.0.1)

LettresFaciles est un logiciel facilitant la création et la rédaction de lettres types. Son inte...

Cliquez pour télécharger LettresFaciles 2011