Estoy creando una página de registro en react.js que requiere dos solicitudes de publicación de axios diferentes. Los puse a ambos en axios.all(). Este es mi código:
axios .all([ axios.post( "https://api.chatengine.io/users/", { username: userName, secret: password }, // Body object { headers: authObject } // Headers object ), axios.post("http://localhost:4000/register", { email: email, password: password, username: userName, }), ]) .then((res) => { if (res.data === "User With Email Already Exists") { setError("User With Email Already Exists"); console.log(res); } else { navigate("/login"); } }); En su mayor parte, funciona completamente bien. Sin embargo, cuando un usuario se registra e ingresa un correo electrónico que ya existe en mi base de datos, no arroja el error que dice "El usuario con correo electrónico ya existe". Simplemente no hace nada. En la consola dirá Failed to load resource: the server responded with a status of 400 () y Uncaught (in promise) Error: Request failed with status code 400 . Entonces, claramente hay un error y el mensaje de error que configuré no se muestra. Cuando tuve dos llamadas axios separadas, pude mostrar el mensaje de error sin problemas, entonces, ¿qué cambió? ¡Cualquier ayuda sería apreciada!
cualquier otra cosa que no sean las respuestas 2xx va a "atrapar" en la biblioteca axios. su api está respondiendo con 400, así que lo que puede hacer es:
axios .all([ axios.post( "https://api.chatengine.io/users/", { username: userName, secret: password }, // Body object { headers: authObject } // Headers object ), axios.post("http://localhost:4000/register", { email: email, password: password, username: userName, }), ]) .then((res) => { navigate("/login"); }) .catch((e) => { if (e.response?.data === "User With Email Already Exists") { setError("User With Email Already Exists"); console.log(e): } });