Comment envoyer plusieurs requêtes avec axios ?

Question

Je fais un registre React avec quelques champs (idStudent (clé primaire et auto-incrémentation), prénom, nom, ..., professeur, prérequis) et j'utilise Formik & yes pour la validation.

Plus tard, j'ai dû associer ma candidature à un système de recommandation (recommander des projets de fin d'études aux étudiants) basé sur des prérequis et des notes obtenues dans certaines matières.

Au début, je n'utilisais qu'une seule table pour stocker les données du formulaire front-end,

Étudiant (prénom, nom, ..., prérequis)

Les étudiants peuvent sélectionner des prérequis dans la sélection de réponses qui contient des prérequis selon l'instructeur (Exemple : si l'étudiant étudie l'informatique, la sélection de réponses affichera uniquement les prérequis en informatique tels que Reaction, Angular, Machine Learning, ...). Étant donné qu'un étudiant peut avoir plusieurs prérequis, la colonne des prérequis dans la table des étudiants contiendra plusieurs identifiants pour le prérequis sélectionné, Les prérequis sont stockés dans une autre table de ma base de données (prerequisites(idFaculty, idPreconditions, prerequisites)) Je sais que je peux utiliser un fichier JSON pour stocker plusieurs identifiants dans une colonne, mais après avoir fait quelques recherches sur Stackoverflow dans certains articles précédents, j'ai trouvé que le traitement de JSON est difficile, surtout si je souhaite mettre à jour une colonne. J'ai donc créé un autre tableau pour stocker les prérequis sélectionnés par les étudiants lors de leur inscription

(studentPrecessions(idStd(clé étrangère faisant référence à idStudent de la table des étudiants), idPrecession(clé étrangère faisant référence à idPrecessions de la table des prérequis))

Le problème auquel je suis confronté est de savoir comment envoyer une demande de deux publications via axios, compte tenu J'ai pensé que je devrais peut-être utiliser une boucle pour stocker plusieurs lignes au cas où les étudiants sélectionneraient plusieurs prérequis.

Voici ce que j'ai fait :

Mes fichiers backend

app.post("/registerStudent", (req, res) => {
  const faculty = req.body.faculty;
  const firstName = req.body.firstName;
  const lastName = req.body.lastName;
  const phone = req.body.phone;
  const email = req.body.email;
  const password = req.body.password;
  db.query(
    "INSERT INTO students (email, password, firstName, lastName, faculty, phone) VALUES (?,?,?,?,?,?)",
    [email, password, firstName, lastName, filiere, phone],
    (err, result) => {
      if (err) {
        console.log(err);
      } else {
        // store chosen prerequisites
        //result.insertId is the current idStudent of the student who registering
        const idStd = result.insertId;
        const idPrerequisite = req.body.idprerequis;
        db.query(
          "INSERT INTO studentPrerequisites (idStd, idPrerequisite) VALUES (?,?)",
          [idFiliere, idPrerequisite],
          (err, result) => {
            if (err) {
              console.log(err);
            } else {
              res.send("Values Inserted");
            }
          }
        );
      }
    }
  );
});

Mon code front-end

const onSubmit = (values, actions) => {
    Axios.post("http://localhost:3001/registerStudent", {
      faculty: values.faculty,
      firstName: values.firstName,
      lastName: values.lastName,
      phone: values.phone,
      email: values.email,
      password: values.password,
    })
      .then(() => {
       //preId is an array  that contains the selected prerequisites(id's) from react select  
       //I try to use a for loop to store multiple of prerequisites dynamically in case a 
       //student select multiple prerequisites
        for (let i = 0; i < preId.length; i++) {
            idPrerequisites: preId[i],
        }
      })
      .then(() => {
        console.log("success!");
      });
    actions.resetForm();
  };

Answer 1

Il est préférable de laisser le backend gérer plusieurs prérequis en transmettant un tableau de prérequis à votre demande. J'utiliserais également Knex et async/await pour éviter beaucoup de chaînages .then et profiter des transactions. Si une erreur se produit dans la transaction, la transaction reprendra toutes les requêtes. Knex facilite également l'interrogation de votre base de données avec des méthodes intégrées sans avoir à écrire du SQL brut. Vous devez également utiliser la déstructuration d'objets au lieu de faire firstName = req.body.firstName, lastName = req.body.lastName, etc. Vous pouvez en savoir plus sur knex et y connecter des bases de données ici : https://knexjs.org/guide/#node-js Et pourquoi ne hachez-vous pas vos mots de passe ? C’est au moins la sécurité la plus élémentaire que vous devriez mettre en place !