Discussion :

[clickandgo]

Bonjour à tous

Lorsque je tente de récupérer la variable PHP nommée $userRole le résultat de la requête Ajax montre : " "banker"Connexion en cours" , autrement dit la "response' concatène la variable en question avec le message contenu dans le 'Die' de mon code, pourquoi ?

Si je tente de récupérer uniquement la variable en faisant un json.PARSE de la 'response' (en écrivant response['userRole']) cela m'indique soit 'undefined' soit 'JSON.parse: unexpected character at line 1 column 1 of the JSON data' ...

La variable est pourtant retournée dans la réponse à la requête Ajax et est entourée de doubles quotes !

Merci d'avance pour vos éclaircissements

loginFormFn.php:

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
 
<?php
require_once $_SERVER['DOCUMENT_ROOT'] . '/functions-php/connexion.php';
//$userAlert = "";
//$userRole = "";
 
if (isset($_POST['displayName']) && isset($_POST['userPassword'])) {
 
    $displayName = $_POST['displayName'];
    $userPassword = $_POST['userPassword'];
 
    //Recherche les utilisateurs et banquiers ayant nom et mot de passe 
    //qui correspondent avec les données présentes dans la base de données
    try {
        $sql = $conn->query("SELECT userName, userPassword, userRole
                        FROM users 
                        WHERE userName='" . $displayName . "' 
                        AND userPassword='" . $userPassword . "'
                        UNION
                        SELECT bankerName, bankerPassword, userRole
                        FROM bankers
                        WHERE bankerName='" . $displayName . "'
                        AND bankerPassword='" . $userPassword . "'
                        ");
    } catch (PDOException $e) {
        echo "La requête n'a retourné aucune donnée...";
    }
 
    //Si la requête est fructueuse on ouvre une session et on précise le rôle de l'utilisateur
    //(banquier ou simple utilisateur : information remontée par la requête ($userRole))
    $row = $sql->fetchObject();
    $userRole = $row->userRole;
 
    echo json_encode($userRole);
 
    if ($sql->rowCount() > 0) {
 
        session_start();
        $_SESSION['loggedIn'] = true;
        $_SESSION['displayName'] = $displayName;
        $_SESSION['userRole'] = $userRole;
 
        die("Connexion en cours...");
 
        //Si utilisateur non reconnu on le signale dans le formulaire de login
        //et l'on redirige vers la page de garde
    } else {
 
        die("Utilisateur ou mot de passe non reconnu, veuillez vérifier vos coordonnées");
    }
};

loginForm.js :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
var myLoginForm = document.getElementById('loginForm');
 
$(document).ready(function () {
    $("#submit").on('click', function (event) {
        event.preventDefault();
 
        var displayName = $("#displayName").val();
        var userPassword = $("#userPassword").val();
 
        if (displayName == "" || displayName.length < 5) {
 
            alert("Veuillez renseigner un nom d'utilisateur (min 5 caractères)")
            return false
        }
        if (userPassword == "") {
            alert('Veuillez renseigner un mot de passe')
            return false
        }
 
        $.ajax(
            {
                url: '/includes/loginForm.php',
                method: 'POST',
                data: {
                    loggedIn: true,
                    dataType: 'json',
                    displayName: displayName,
                    userPassword: userPassword
                },
                success: function (response) {
                    var userRolePHP = JSON.parse(response)
 
                    console.log('Variable venant de php = ' + userRolePHP)
                    $("#response").html(response)
                    /*setTimeout(() => {
                    //On ouvre soit la console d'administration pour un banquier
                    //soit la page des comptes de l'utilisateur
                    //if (userRole == "banker") {
 
                    //$(location).attr('href', '/views/adminConsole.php')
                    // } else {
                    //$(location).attr('href', '/views/clientAccounts.php')
                    //}
                }, 1500)*/
 
                },
            });
 
        //var userRolePHP = "this.response['userRole']"//Cette variable vient de la page loginFormFn.php
        /* $.ajax(
             {
                 url: '/includes/loginForm.php',
                 method: 'GET',
                 dataType: 'json',
                 success: function (response) {
                     alert('Variable venant de php = ' + response['userRole'])
                 }
             });*/
    });
});
/*var displayName = document.getElementById('displayName')
 
 
myLoginForm.addEventListener('submit', function (event) {
    if (myLoginForm.checkValidity() === false) {
        console.log('Une erreur est survenue')
        event.preventDefault()
        event.stopPropagation()
 
    } else {
        myLoginForm.classList.add('was-validated')
        alert("Données envoyées")
    }
})
 
// Empêche la fermeture du formulaire inclus dans le dropdown
document.getElementById("dropDownLoginForm").addEventListener('click', function (event) {
    event.stopPropagation();
});*/
 
//alert(userRolePHP);

[mathieu]

c'est le comportement normal des fonctions "die" et "exit", la chaine passée à la fonction est affichée.
https://www.php.net/manual/fr/function.exit.php

[clickandgo]

Merci Mathieu pour ta réponse

Mais alors, comment récupérer que la variable pour traitement ?

[Toufik83]

Si tu utilises dataType:"json" d'ajax (qui est mal placé dans ton code js), les messages que tu veux afficher via php doivent être enregistrés dans un tableau global comme par exemple :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
 
$retour=[];
....
//Si tu veux enregistrer une valeur dans $retour 
$retour["NomVariable"]="ton message....";
....
echo json_encode($retour);

Ensuite tu le récupères du côté js :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
success: function (response) {
    alert("variable php : "+response.NomVariable);
   //ou bien avec console.log 
   console.log("variable php :",response.NomVariable);
}

Puis je ne vois pas pourquoi tu mets dataType:'json' à l'intérieur de data .

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
 
$.ajax({
   ....,
   data: {
            loggedIn: true,
            dataType: 'json',//mal placé !
            ....
   }
});

La correction est :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
 
$.ajax({
   ....,
   dataType:"json",
   data: {
            loggedIn: true,
            ....,
            ....
   }
})

Et tu n'as pas besoin de convertir le retour en json avec JSON.parse(), car ajax le fait automatiquement.

En gros, il faut utiliser un seul echo json_encode($retour); et tout à la fin du script, et surtout ne pas utiliser des echo,die,exit.

[clickandgo]

Merci beaucoup pour ta réponse claire et concise, cependant il reste 2 problèmes :

1/ La 'response' renvoie [object Object] bien que je vois mon string de tableau en première ligne dans la console du navigateur + le restant du code php...

J'ai essayé 'stringify' ou 'reponse[0].reponsePHP', rien ne change ... Comment transformer cet objet ?

2/ En suivant ton conseil de ne pas utiliser Die ou Exit, comment alors stopper le code suivant condition ? avec 'return false' ?

Merci d'avance

Code Jquery/Ajax :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
$(document).ready(function () {
    $("#submit").on("click", function (event) {
 
        var displayName = $("#displayName").val();
        var userPassword = $("#userPassword").val();
 
        if (displayName == "" || displayName.length < 5) {
 
            alert("Veuillez renseigner un nom d'utilisateur (min 5 caractères)")
            return false
        }
        if (userPassword == "") {
            alert('Veuillez renseigner un mot de passe')
            return false
        }
 
        $.ajax(
            {
                url: '/includes/loginForm.php',
                method: "POST",
                dataType: "json",
                data: {
                    displayName: displayName,
                    userPassword: userPassword
                },
                success: function (response) {
                    console.log(response.reponsePHP)
                    /*switch (response.reponsePHP) {
 
                        case "wrongUserName":
 
                            $("#userAlert").html("Aucun utilisateur n'a été trouvé avec ce nom, veuillez vérifier votre nom d'utilisateur svp.")
                            event.preventDefault()
                            event.stopPropagation()
                            break
 
                        case "wrongCredentials":
                            $("#userAlert").html("Le mot de passe fourni ne correspond pas à celui enregistré dans votre compte... Veuillez vérifier votre mot de passe svp.")
                            event.preventDefault()
                            event.stopPropagation()
                            break
 
                        case "banker":
                            $("#userAlert").html("Connexion à la console d'administration en cours ...")
                            setTimeout(function () { window.location.href = "/views/adminConsole.php" }, 2000);
                            break
 
                        case "user":
                            $("#userAlert").html("Connexion à votre compte en cours ...")
                            setTimeout(function () { window.location.href = "/views/clientAccounts.php" }, 2000);
                            break
 
                        default:
                            $("#userAlert").html("Retour à la page d'accueil ...")
                            timer()
                            setTimeout(function () { window.location.href = "/index.php" }, 2000);
                    }*/
                },
                error: function (response) {
                    alert(response)
 
                }
            });
    });
});

partie du code PHP utilisé pour tester avec la nouvelle méthode :

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<?php
require_once $_SERVER['DOCUMENT_ROOT'] . '/functions-php/connexion.php';
//$userAlert = "";
 
 
if (isset($_POST['displayName']) && isset($_POST['userPassword'])) {
 
    $displayName = $_POST['displayName'];
    $userPassword = $_POST['userPassword'];
 
    $retour = [];
    userCheck();
};
 
/*Retourne uniquement un nom d'utilisateur pour en vérifier l'existence dans la base
(fonction devenant disponible aussi dans le formulaire d'inscription)*/
function userCheck()
{
    global $displayName;
    global $conn;
    global $retour;
 
    try {
        $sql1 = $conn->query("SELECT userName from users 
                                WHERE userName ='" . $displayName . "'
                                UNION 
                                SELECT bankerName from bankers 
                                WHERE bankerName='" . $displayName . "'");
    } catch (PDOException $e) {
        $e->getMessage();
    };
 
    if ($sql1->rowCount() == 0) {
        $retour["reponsePHP"] = "wrongUserName";
        echo json_encode($retour);
        return false;
    } else {
        checkCredentials();
    };
};
 
function checkCredentials()
{

[Toufik83]

Bonjour,

Il faut préciser à quel endroit le retour d'ajax est exécuté ? dans le bloc de success ou celui d'error ?

Si tout est Ok, $.ajax exécute le code de success, et donc tu peux voir la réponse soit avec un console.log pour la visualiser dans la console du navigateur, ou bien avec alert (perso, je préfère les console.log) :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
success:function(response){
    console.log("succès ajax :",response);//voir ce que ça donne dans la console du navigateur
}

S'il y'a une erreur PHP, $.ajax passe directement au bloc error et le message est enregistré dans la propriété responseText :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
error:function(response){
   console.log("Erreur ajax :",response.responseText);//voir la console du navigateur
   alert("Erreur ajax :"+response.responseText);//affiche un pop-up
}

Quand j'ai dis de ne pas utiliser des messages avec die et exit, je voulais dire qu'il ne faut pas mettre du texte à l'intérieur die("Message...."); mais plutôt :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
$retour["echec"]="Message d'échec";
die();//ou exit();

Après il faut te servir de l'outil de développement du navigateur (F12 sous chrome) et voir le résultat de la requête ajax sous l'onglet Network en cliquant sur le lien de l'appel ajax du volet gauche Name puis Preview et Response.