Tengo una matriz de longitud desconocida (entre 1 y 16) y me gustaría enviar una solicitud XMLHTTP para cada elemento de la matriz de forma asíncrona. Una vez que se complete la solicitud final, me gustaría imprimir los datos de cada respuesta.
Sin embargo, actualmente, solo se imprime la respuesta del elemento final. Alguien sabe por qué es esto?
Aquí está mi código:
var responseData = []; var numCompletedRequests = 0; inputArray.forEach((element) => { let newRequest = new XMLHttpRequest(); newRequest.open("POST", url, true); newRequest.onreadystatechange = () => { if (newRequest.readyState === 4 && newRequest.status !== 200) { // Request failed numCompletedRequests++; handleFailedRequest(newRequest); // Another function to handle errors } else if (newRequest.readyState === 4 && newRequest.status === 200) { // Request succeeded numCompletedRequests++; responseData.push(newRequest.response); } if (numCompletedRequests === inputArray.length) { // This is the last request to come in. Ready to print console.log(responseData); return; } newRequest.send(element); }); Por ejemplo, si mi matriz de entrada tuviera 3 elementos, la responseData de la matriz de salida tendría 3 elementos de largo, pero contendría 3 elementos idénticos: la respuesta de la última solicitud que finalizó.
¿Alguien sabe por qué es esto y cómo puedo solucionarlo?
Gracias
¿Qué tal usar Promise.All?
const url1 = "url1" const url2 = "url2" const url3 = "url3" const fetchMultiAsync = async () => { const responses = await Prmoise.all([fetch(url1),fetch(url2),fetch(url3)]) return responses } fetchMultiAsync() // return [response of req1, req2, req3]