xmlhttprequest simultaneous request not working - javascript

I'm trying to make "many" xhr request but it seems that every time it waits for the answer before making another request. It's like XHR makes a queue and always wait for the previous request to finish.
What can I do to run more simultaneous xhr request?
$('body').delegate('.download','click', function(evt){
evt.preventDefault(); // Not related
var xhr = new XMLHttpRequest();
xhr.open('GET', "proxy.php?" + this.href, true);
xhr.responseType = 'blob';
xhr.onload = function() {
if (this.status == 200) {
var blob = new Blob([this.response], {type:'audio/mp4'});
console.log(blob.size);
if(blob.size > 0){
$("<a>").attr({
download: name,
href: URL.createObjectURL(blob),
target: "_blank"
})[0].click();
}
}
};
xhr.send();
});

Not a lot.
Browsers enforce a limit on:
The number of parallel HTTP requests to a given origin
The number of parallel HTTP requests in total (this is a larger limit)
If you split your requests between more originals you might find your constraint raised from the first to the second of the above.

Try to find something about http2, there is some info. Http2 protocol have better supporting of parallel requests.

Related

XMLHttpRequest returning request.status 0 for only certain URL on site

I have a React Native app that is downloading and parsing ical/ics files from public feeds to get sports team schedules. When I use the url for a single team's schedule everything works great and 200 is returned.
var request = new XMLHttpRequest();
request.open(
"GET",
"http://athletics.cgps.org/calendar/team_112.ics",
true
);
request.send(null);
request.onreadystatechange = () => {
console.log(request.status);
}
};
When I try a url that downloads the schedule for all teams from the same website / FQDN it fails. This url is much longer and pulls down much more data. I don't think it could be a CORS issue since another feed from the same site works. Both URLs work fine if entered directly into a web browser. But this one returns 0:
var request = new XMLHttpRequest();
request.open(
"GET",
"http://athletics.cgps.org/cf_calendar/feed.cfm?type=ical&teams=0,155,118,117,116,115,146,145,142,143,144,133,139,138,148,114,113,111,112,140,131,147,134,141,120,119,127,126,124,125,130,129,128,123,137,135",
true
);
request.send(null);
request.onreadystatechange = () => {
console.log(request.status);
}
};

Cross-domain XMLHttpRequest request fails in headless chrome

As the title says, I'm having problems making an headless chrome bot execute a XMLHttpRequest to another domain. The bot executes this code:
var xhr = new XMLHttpRequest();
xhr.open('GET', 'http://localhost:30000/login', true);
xhr.withCredentials = true;
xhr.send(null);
xhr.onreadystatechange = function () {
var DONE = 4; // readyState 4 means the request is done.
var OK = 200; // status 200 is a successful return.
if (xhr.readyState === DONE) {
if (xhr.status === OK) {
new Image().src='https://requestb.in/127kh4s1?c=OK';
} else {
new Image().src='https://requestb.in/127kh4s1?c=error-'+(xhr.status);
}
}
};
In my request bin the request are always ?c=error-0, indicating a fail with status code 0. When I visit the page manually, I get c=OK, which leads me to believe it's a problem with my bot.
From there I don't really know what to look for... The bot uses chrome-remote-interface to interact with a chromium browser. The browser is started with these flags: "--headless", "--no-sandbox", "--disable-web-security".
Any suggestion what I should try next?

On slow network previous Ajax request gets cancelled by the subsequent

I have the following problem:
I'm trying to send two Ajax requests almosts simulateously:
function ajax()
{
xhr = new XMLHttpRequest();
xhr.onreadystatechange = function()
{
if(xhr.readyState == 4)
console.log(xhr.responseText);
}
xhr.open('GET', 'list.html', true);
xhr.send('');
}
ajax();
ajax();
The problem is that only one of them succeeds.
And if I try in the DevTools my self, if the network speed is high, they get both executed (when I quickly type the ajax() function twice in the console) while if I lower the network speed and again type them quickly only one of them succeeds.
Why is this happening? How can I avoid this auto canceling of simultaneous xhr requests?
You should use a local variable to hold the XMLHttpRequest. Since you're using a global variable, the callback function always refers to the second AJAX request that was sent. So change:
xhr = new XMLHttpRequest();
to:
var xhr = new XMLHttpRequest();
Then each callback funtion will be a closure that refers to that specific request that was sent.

Check if ajax was aborted

I am not using jquery (cause I cant in this specific project) so how do I know the request was aborted by user using .abort() method? I read a lot and there is no abort method in the object XMLHttpRequest.
I know I can chek the status and readyStatus of onreadystatechange but it does not tell me anything if the connection was aborted
thans.
You can determine if the request has been aborted by testing the readyState, which will again be 0.
var xhr = new XMLHttpRequest();
console.log(xhr.readyState); // 0
xhr.open('GET', '/');
console.log(xhr.readyState); // 1
xhr.abort();
console.log(xhr.readyState); // 0
If you need to know when it's aborted, not just if, then you'll have to use onabort as onreadystatechange won't be triggered by it.
var xhr = new XMLHttpRequest();
xhr.onabort = function () {
console.log('Was aborted', xhr.readyState);
};
xhr.open('GET', '/');
xhr.send();
xhr.abort(); // Was aborted 0

First XHR request very slow in QML(javascript running on v8)

I have a QML page (Qt Quick 2) that makes an XHR request to an external server. Right now the server is running on my local machine and the first time this request is made it takes ~1.5 seconds. Each subsequent request is under 100ms.
When I make this same request using a browser I get a response in under 10ms everytime, so I know the problem isn't there.
Here is the offending code. Any ideas?
function login(key) {
var xhr = new XMLHttpRequest();
var params = "Fob_num=" + key;
xhr.open("POST","http://localhost:9000/customer_login",true);
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.setRequestHeader("Content-length", params.length);
xhr.setRequestHeader("Connection", "close");
xhr.onreadystatechange = function() {
if ( xhr.readyState == xhr.DONE) {
if ( xhr.status == 200) {
handleResponse(xhr.responseText);
} else {
console.log("error with login--status: " + xhr.status)
displayErr("Oops, something's wrong. Please try again.")
}
}
}
xhr.send(params);
}
The problem isn't with handleResponse() function, I've already tried replacing it with a console.log(“response”), and it still takes just as long. I also tried replacing localhost with my ip.
You may want to create a dummy XMLHttpRequest instance in a dummy QML component that you asynchronously load with a Loader. Just an idea. Perhaps creating the first XMLHttpRequest instance takes long?

Categories

Resources