React - JS Api : Résoudre les retours non définis
P粉253800312
P粉253800312 2024-04-03 17:51:57
0
1
425

Je suis nouveau sur React et js et j'ai un peu de mal à comprendre le fonctionnement de Promise et de solve.

J'essaie d'utiliser l'API pour me connecter à une application dotée d'une base de données interne SQL. Les requêtes fonctionnent bien et renvoient ce dont elles ont besoin, mais étrangement, l'analyse des données json ne finit pas par fonctionner et les renvoie comme indéfinies.

Voici le code pertinent actuel dans l'API :

userAuth = (identifiant, mdp) => {
    return new Promise((resolve, reject) => {
      config.query(
        "SELECT identifiant, mdp FROM utilisateur WHERE identifiant = '"+identifiant+"' and mdp = '"+mdp+"'",
        (error, utilisateur) => {
          if (error) {
            return reject(error);
          }
          //une petite manipulation de donnée pour éviter des soucis de format par la suite.
          return resolve(utilisateur);
        }
      );
    });
  };
  
   
  
  app.post("/auth", (req, res) => {
    console.log("connection");
    const data = {
      identifiant: req.body.Identifiant,
      mdp: req.body.Password,
    };
    console.log(data);

    userAuth(data.identifiant, data.mdp)
      .then((response) => {
        console.log(response);
        res.send(response);
      })

      .catch((error) => {
        console.log(error);
        res.status(500).send("Erreur serveur");
      });
  });

Voici le code correspondant de mon application :

const handleSubmit = async (event) => {
        event.preventDefault();
        const id = formAuth.Identifiant;
        const password = formAuth.Password;
        if(!password.match(re)){alert("Format de mot de passe incorrect")}
        else {
            const response = await postAuth();
            console.log(response);
            if (response.lenght != 0){
                navigAcc('/Accueil');
            }
            else{
                alert("Identifiant ou mot de passe incorrect")
            }
        }
    }

const postAuth = async () => {
        const body = {
          Identifiant: formAuth.Identifiant,
          Password: formAuth.Password
        };      
        const config = {
          headers: {
            'Content-Type': 'application/json'
          }
        };
        const response = (await axios.post(api+"auth", body, config));
        setFormAuth({
            Identifiant:'',
            Password:''
        })
      };

J'ai trouvé une autre question similaire sur le site (Pourquoi le routeur n'est-il pas défini dans React js ?), mais je n'ai vu aucune différence significative entre ce que je fais et la réponse soumise, donc je me sens très perdu.

J'ai essayé d'analyser la réponse de l'API dans json et même s'il s'agissait déjà d'une erreur de type, j'ai essayé de traiter la réponse de l'application comme un tableau, j'ai essayé de la traiter comme un booléen selon qu'elle était vide ou non et voir si Je pourrais. Peu importe ce qu'il y a à l'intérieur, car il ne sera rempli que si la validation est valide. Je ne vois pas vraiment le problème, mais je sais que c'est spécifiquement sur la promesse de userAuth car cela semble être la seule chose qui crée ou reformule l'erreur lorsque je la touche.

P粉253800312
P粉253800312

répondre à tous(1)
P粉777458787

J'ai oublié de le retourner après postAuth.

const postAuth = async () => {
    const body = {
      Identifiant: formAuth.Identifiant,
      Password: formAuth.Password
    };      
    const config = {
      headers: {
        'Content-Type': 'application/json'
      }
    };
    const response = (await axios.post(api+"auth", body, config));
    setFormAuth({
        Identifiant:'',
        Password:''
    })
    return response;
  };
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal