Js AJAX auth - Historique des versions

Jc.forton : /* Coté client */

2018-02-11T20:47:18Z

Coté client

← Version précédente		Version du 11 février 2018 à 22:47
Ligne 58 :		Ligne 58 :

	=== Coté client ===		=== Coté client ===
	Coté client, il nous trois fichiers.		Coté client, il nous faut trois fichiers.
	Le fichier ''ajax.js'' pour instancier l'objet XmlHttpRequest :		Le fichier ''ajax.js'' pour instancier l'objet XmlHttpRequest :
	<source lang="javascript" style="border:1px solid black;font-size:120%">		<source lang="javascript" style="border:1px solid black;font-size:120%">

Jc.forton : /* Coté Serveur */

2016-06-09T22:31:39Z

Coté Serveur

@@ Ligne 11 : / Ligne 11 : @@
 <source lang="php" style="border:1px solid black;font-size:120%">
 <?php
 function getServerVariable($var) {

Jc.forton : /* Coté client */

2016-06-09T22:29:38Z

Coté client

← Version précédente		Version du 10 juin 2016 à 00:29
Ligne 69 :		Ligne 69 :
	var xhr = getXhr();		var xhr = getXhr();
	// Ouverture de l'URL en GET		// Ouverture de l'URL en GET
	xhr.open("GET", "http://127.0.0.1~~/auth~~", false);		xhr.open("GET", "http://127.0.0.1", false);
	// Envoie de la requête		// Envoie de la requête
	xhr.setRequestHeader("Authorization", "Basic " + btoa(user + ":" + password));		xhr.setRequestHeader("Authorization", "Basic " + btoa(user + ":" + password));

Jc.forton : /* Coté client */

2016-06-09T22:28:45Z

Coté client

← Version précédente		Version du 10 juin 2016 à 00:28
Ligne 87 :		Ligne 87 :
	<source lang="html5" style="border:1px solid black;font-size:120%">		<source lang="html5" style="border:1px solid black;font-size:120%">
	<html>		<html>

	<head>		<head>
	<script type="text/javascript" src="ajax.js"></script>		<script type="text/javascript" src="ajax.js"></script>

Jc.forton : /* Coté Serveur */

2016-06-09T22:26:07Z

Coté Serveur

← Version précédente		Version du 10 juin 2016 à 00:26
Ligne 34 :		Ligne 34 :
	return false;		return false;
	}		}
	if($login !== "toto" && $password !== "password"){		if($login !== "toto" \|\| $password !== "password"){
	// Identifiants faux, on retourne false et HTTP 401 : Unauthorized		// Identifiants faux, on retourne false et HTTP 401 : Unauthorized
	http_response_code ( 401 );		http_response_code ( 401 );

Jc.forton : /* Introduction */

2016-06-09T22:23:53Z

Introduction

← Version précédente		Version du 10 juin 2016 à 00:23
Ligne 5 :		Ligne 5 :

	Par exemple, pour ''toto:password'' on aura le header suivant: ''Basic dG90bzpwYXNzd29yZA==''		Par exemple, pour ''toto:password'' on aura le header suivant: ''Basic dG90bzpwYXNzd29yZA==''
			=Mise en place =
	=== Coté Serveur ===		== Coté Serveur ==
	Nous allons gérer l'authentification en renvoyant le code ''202 Accepted'' si l'authentification est correcte et ''401 Authorization Required'' si elle échoue.		Nous allons gérer l'authentification en renvoyant le code ''202 Accepted'' si l'authentification est correcte et ''401 Authorization Required'' si elle échoue.
	Pour cela nous allons avoir besoin du code suivant dans le ''index.php'' :		Pour cela nous allons avoir besoin du code suivant dans le ''index.php'' :

Jc.forton : /* Coté client */

2016-06-09T22:23:21Z

Coté client

← Version précédente		Version du 10 juin 2016 à 00:23
Ligne 69 :		Ligne 69 :
	var xhr = getXhr();		var xhr = getXhr();
	// Ouverture de l'URL en GET		// Ouverture de l'URL en GET
	xhr.open("GET", "http://~~192~~.~~168~~.~~100~~.~~200~~/auth", false);		xhr.open("GET", "http://127.0.0.1/auth", false);
	// Envoie de la requête		// Envoie de la requête
	xhr.setRequestHeader("Authorization", "Basic " + btoa(user + ":" + password));		xhr.setRequestHeader("Authorization", "Basic " + btoa(user + ":" + password));

Jc.forton : /* Coté client */

2016-06-09T22:23:00Z

Coté client

← Version précédente		Version du 10 juin 2016 à 00:23
Ligne 48 :		Ligne 48 :

	=== Coté client ===		=== Coté client ===
	Coté client, il nous ~~faut~~ le fichier pour		Coté client, il nous trois fichiers.
			Le fichier ''ajax.js'' pour instancier l'objet XmlHttpRequest :
			<source lang="javascript" style="border:1px solid black;font-size:120%">
			function getXhr() {
			var xhr;
			if (window.XMLHttpRequest) {
			// code for IE7+, Firefox, Chrome, Opera, Safari
			xhr = new XMLHttpRequest();
			} else {
			// code for IE6, IE5
			xhr = new ActiveXObject("Microsoft.XMLHTTP");
			}
			return xhr;
			}
			</source>
			Le fichier ''auth.js'' qui va faire l'authentification :
			<source lang="javascript" style="border:1px solid black;font-size:120%">
			function auth(user, password) {
			// Création de l'objet XHR
			var xhr = getXhr();
			// Ouverture de l'URL en GET
			xhr.open("GET", "http://192.168.100.200/auth", false);
			// Envoie de la requête
			xhr.setRequestHeader("Authorization", "Basic " + btoa(user + ":" + password));
			xhr.send();
			// Récupération de la réponse
			return xhr.status == 202;
			}
			function doAuth(user, password){
			if(auth(user, password)){
			alert("Auth OK!");
			}else{
			alert("Try again");
			}
			}
			</source>
			Et enfin, le fichier index.html pour appeler le tout :
			<source lang="html5" style="border:1px solid black;font-size:120%">
			<html>

			<head>
			<script type="text/javascript" src="ajax.js"></script>
			<script type="text/javascript" src="auth.js"></script>
			</head>
			<body onLoad="doAuth('toto', 'password')">
			</body>
			</html>
			</source>
			Vous devriez voir s'afficher ''Auth OK!'' avec comme code HTTP 202 !

Jc.forton : /* Coté Serveur */

2016-06-09T22:16:17Z

Coté Serveur

← Version précédente		Version du 10 juin 2016 à 00:16
Ligne 35 :		Ligne 35 :
	}		}
	if($login !== "toto" && $password !== "password"){		if($login !== "toto" && $password !== "password"){
	// ~~Identifiant~~ faux, on retourne false et HTTP 401 : Unauthorized		// Identifiants faux, on retourne false et HTTP 401 : Unauthorized
	http_response_code ( 401 );		http_response_code ( 401 );
	echo json_encode ( false );		echo json_encode ( false );
	}else{		}else{
	// ~~Identifiant~~ ok, on retourne true et HTTP 202: Accepted		// Identifiants ok, on retourne true et HTTP 202: Accepted
	http_response_code ( 202 );		http_response_code ( 202 );
	echo json_encode ( true );		echo json_encode ( true );

Jc.forton : Page créée avec « = Introduction = Le mécanisme ''Auth Basic'' consiste a faire passer le login et le mot de passe dans le header "Authorization" de la requête ''HTTP''. Le login et le m... »

2016-06-09T22:15:29Z

Page créée avec « = Introduction = Le mécanisme ''Auth Basic'' consiste a faire passer le login et le mot de passe dans le header "Authorization" de la requête ''HTTP''. Le login et le m... »

Nouvelle page

= Introduction =
Le mécanisme ''Auth Basic'' consiste a faire passer le login et le mot de passe dans le header "Authorization" de la requête ''HTTP''.

Le login et le mot de passe sont ajoutés comme suit, ''login:password'', puis encodé en base 64.

Par exemple, pour ''toto:password'' on aura le header suivant: ''Basic dG90bzpwYXNzd29yZA==''

=== Coté Serveur ===
Nous allons gérer l'authentification en renvoyant le code ''202 Accepted'' si l'authentification est correcte et ''401 Authorization Required'' si elle échoue.
Pour cela nous allons avoir besoin du code suivant dans le ''index.php'' :
<source lang="php" style="border:1px solid black;font-size:120%">
<?php

function getServerVariable($var) {
if (isset ( $_SERVER [$var] ) && ! empty ( $_SERVER [$var] )) {
return $_SERVER [$var];
}
return false;
}

function main(){
$method = $_SERVER ['REQUEST_METHOD'];
if($method !== "GET"){
// HTTP 405 : Method Not Allowed
http_response_code(405);
echo json_encode(false);
}
$login = getServerVariable("PHP_AUTH_USER");
$password = getServerVariable("PHP_AUTH_PW");
if ($login === FALSE || $password === FALSE) {
// Pas d'identifiant on retourne false et HTTP 401 : Unauthorized
http_response_code ( 401 );
echo json_encode ( false );
return false;
}
if($login !== "toto" && $password !== "password"){
// Identifiant faux, on retourne false et HTTP 401 : Unauthorized
http_response_code ( 401 );
echo json_encode ( false );
}else{
// Identifiant ok, on retourne true et HTTP 202: Accepted
http_response_code ( 202 );
echo json_encode ( true );
}
}
main();
</source>

=== Coté client ===
Coté client, il nous faut le fichier pour

Js AJAX auth - Historique des versions

Jc.forton : /* Coté client */

Jc.forton : /* Coté Serveur */

Jc.forton : /* Coté client */

Jc.forton : /* Coté client */

Jc.forton : /* Coté Serveur */

Jc.forton : /* Introduction */

Jc.forton : /* Coté client */

Jc.forton : /* Coté client */

Jc.forton : /* Coté Serveur */

Jc.forton : Page créée avec « = Introduction = Le mécanisme ''Auth Basic'' consiste a faire passer le login et le mot de passe dans le header "Authorization" de la requête ''HTTP''. Le login et le m... »

Jc.forton : /* Coté client */

Jc.forton : /* Coté Serveur */

Jc.forton : /* Coté client */

Jc.forton : /* Coté client */

Jc.forton : /* Coté Serveur */

Jc.forton : /* Introduction */

Jc.forton : /* Coté client */

Jc.forton : /* Coté client */

Jc.forton : /* Coté Serveur */

Jc.forton : Page créée avec « = Introduction = Le mécanisme ''Auth Basic'' consiste a faire passer le login et le mot de passe dans le header "Authorization" de la requête ''HTTP''. Le login et le m... »