The AJAX onreadystatechange function may not be consistently triggered

I have an issue with my AJAX call to retrieve XML data. It seems that the code does not enter the onreadystatechange function until the last iterations of my foreach loop. This delay is likely due to the time it takes for the calls to "www.webpage.com/" + arrayValue to complete, leading to the state being updated to "Ready" only towards the end of the loop. As traditional Wait() statements don't work in JavaScript or AJAX, I'm wondering how I can address this problem effectively.

var getXML = new XMLHttpRequest();

myArray.forEach((arrayValue, index) => {
    getXML.open("GET", "www.webpage.com/" + arrayValue, true);
    getXML.setRequestHeader('Access-Control-Allow-Credentials', true);
    getXML.setRequestHeader('Authorization', "Basic " + btoa(":something"));
    getXML.send(null);
    getXML.onreadystatechange = function () {
        if(this.readyState == this.DONE) {
             Console.Log("We made it in!");
        }
    }
});

Answer №1

The issue at hand is attempting to utilize the same XMLHttpRequest object for multiple requests.

Avoid doing so. Instead, create a fresh and separate instance of XMLHttpRequest for each request.

myArray.forEach((arrayValue, index) => {
    var newRequest = new XMLHttpRequest();
    newRequest.open("GET", "www.webpage.com/" + arrayValue, true);

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Exploring the Functionality of Bootstrap 5 Collapse Component with VueJS 2

I am attempting to implement the Bootstrap 5 "collapse" component on a button in my VueJS2 project, but I am uncertain about how to integrate it. Within my single file component, the structure is as follows: <template> section: ...

I wonder where the file from the HTML form download has originated

Recently, I've been experimenting with the developer tools in Chrome to observe the behavior of websites at different moments. It has proven useful in automating certain tasks that I regularly perform. Currently, my focus is on automating the process ...

How to handle JavaScript exceptions when encountering a null JSON value?

I am receiving data in JSON format using AJAX from an action in Struts 2 for my view. The data consists of a set of information. For example: {"home": "1234", "room": null} When I try to read data.home, I successfully get the value 1234. However, when a ...

Updating Laravel session during Long PollingLet's discuss how to update the Laravel

Currently, I am working with PHP Laravel 4 framework and implementing long polling technique to continuously refresh a list on my HTML page. Additionally, I have an auto-submitting dropdown list on the same page which resets a session value upon user selec ...

Issue in Wordpress: ReferenceError - '$' is not defined

Currently utilizing WordPress and attempting to access the following code snippet. I am encountering an error on the last line }(jQuery)); (function($) { $(function () { // Slideshow 3 $("#slider3").responsiveSlides({ auto: true, pag ...

Bootstrap datetimepicker is not showing the calendar for selecting a date, making it impossible to choose a specific date

I am facing an issue with integrating the bootstrap datetimepicker with Datatables to filter the data based on selected dates. The problem is that only an input bar is displayed on the page, and there is no calendar or calendar symbol visible. I suspect it ...

Submitting information to a server

I have a simple Angular 6 app with follow and unfollow buttons. When you click follow, the number increases. I want to save these follower numbers to a JSON server. Here is the link to the JSON server documentation: JSON Server Documentation To see a dem ...

What is the best way to keep track of the number of checked checkboxes and add them to a separate div?

I need to select multiple checkboxes from different sections, count them, and then append the same number of sections to another div. ...

The mobile menu functions correctly on Jfiddle but is not functioning on the local server

I was working on a responsive mobile menu and used a toggleClass function to open the menu. It's functioning correctly in Jfiddle and below, but every time I click the nav icon in the live preview within brackets, nothing happens. I even tried it in a ...

Invoke a jQuery function in the parent page using regular JavaScript from an iframe

I have successfully created an iframe using regular javascript. Inside the iframe is a Jquery function along with JQuery itself and it functions correctly within the iframe. However, I am now looking to execute this function from the parent page instead of ...

Tips for capturing and storing video with HTML5 WebRTC

Before reading the description, make sure to run the code snippet first. This will provide you with a better understanding of the structure. In the 2nd video element, I am trying to record, play, and save video. The issue I'm encountering is that the ...

Node.js tutorial: Fetching all pages of playlists from Spotify API

Currently, I am attempting to retrieve all of a user's playlists from the spotify API and display them in a selection list. The challenge lies in only being able to access 20 playlists at a time, which prompted me to create a while loop utilizing the ...

Please insert a decimal point and thousand separator into the text field

I'm trying to incorporate thousand separators and decimal points into my text box. Additionally, I have implemented the following directive: .directive('format', function ($filter) { 'use strict'; return { requir ...

Why is it that I am receiving just one object as a string when making an ajax call, even though the controller is supposed to be returning

I'm having trouble understanding why my $.get call is returning one single object with a string containing my elements, instead of the expected list of objects returned by my controller. Controller: public JsonResult GetInitialTags(int id) { Mod ...

Importing three.js using ES6 syntax

When it comes to working with ES6, my workflow involves using Babel and babel-plugin-transform-es2015-modules-system.js specifically to transform module import/export for compatibility with system.js. I rely on a "green" browser for most ES6 features excep ...

Utilizing Electron and jQuery to incorporate a loading animated GIF into a newly opened window, where the animation pauses

I am working on an electron project that involves opening a new window with an index.html file. In this newly opened window, I have included an animated.gif in the body section. <!doctype html> <html lang="en> <head> <meta charset ...

Unable to fetch local file using ajax from a local HTML page

According to Same Origin Policy, the SOP should not be applied to the file:// protocol. However, I'm having trouble with my code. I am running a testing page from my local system, and both when I try to access abc.txt in the same directory as the HTML ...

Ways to exchange a return statement within an if statement?

Is it feasible to use if conditions instead of utilizing return when dealing with multiple conditions in our program? var v2=[12,23,44,3,1,3,456,78,22]; function checkresult(v2) { return v2 >= 18; } var a = v2.filter(checkresult); document.get ...

Is the image overlay experiencing a flickering issue?

Last time, none of the solutions seemed to work quite right with the project, so let me try asking the question in a slightly different way this time. Basically, I have an image that, when someone hovers their mouse cursor over it, a div appears (containi ...

React Navigation ran into an issue with the specified location

It seems that I am encountering an issue where it is displaying a message stating "no routes matched for location '/'". However, the Header file clearly shows that there is a home component defined for this URL. https://i.sstatic.net/26516LfM.jpg ...