While playing with XHR requests I found interesting thing in making XHR requests from 2 major browsers - Google's Chrome and Mozilla's Firefox.
Request was simple HEAD request to www.google.ba:
var xhr = new XMLHttpRequest();
xhr.open('HEAD' , 'www.google.ba', true);
xhr.onreadystatechange = function (aEvt){
if (xhr.readyState == 4) {
if (xhr.status >= 200 && xhr.status < 304) {
console.log('Connected');
} else {
console.log('No net');
}
}
};
xhr.send();
After trying to make XHR request while there was no connection I would get readyState 4 and status 0 on both browsers. After i reconnected - making XHR request from both browsers were successful.
But here is the thing, after I disconnected again and made request, Chrome returned readyState 4 and status 0 after 9 milliseconds, but Firefox stayed in some kind of pending state and waited to net to return. When I reconnected after 13 seconds, request was successfully processed. I didn't get status 0 on Firefox even after 13 seconds. Is there anyone who could explained these huge differences and how to possibly prevent this behavior on Firefox?
Screenshot from Chrome:
Screenshot from Firefox:
EDIT:
It seems like that Firefox can't detect offline mode, only when I select work offline in browser i get the same result as in Chrome. Is there any way to get same result as in Chrome?
Related
I am trying to debug a functionality that runs from a plain old Javascript Web Page and requests to a server.
This perfectly works on my computer but fails on another (the real target)
When it fails, i get an empty string response from the server.
Here is the code that build the request
// Send request to web server
var url = "/start?f="+filesDesc[iFile].name+"&ft="+ft+"&t="+time0ms;
var req = new XMLHttpRequest();
if (req) {
req.open("POST", url, true);
// Hack to pass bytes through unprocessed.
req.overrideMimeType('text/plain; charset=x-user-defined');
req.timeout = 2000;
req.onreadystatechange = function(e) {
// In local files, status is 0 upon success in Mozilla Firefox
if(req.readyState === XMLHttpRequest.DONE) {
var status = req.status;
if (status === 0 || (status >= 200 && status < 400)) {
// The request has been completed successfully
console.debug(req.responseText);
} else {
console.debug("startPlaying : error while sending rqst" );
}
}
};
req.send();
}
I noticed that on my computer (working) the output header of the request looks like this :
POST /start?f=2021-02-09_14;05;40&ft=1612880820756.4346&t=1614243685530 HTTP/1.1
On the target computer (FAIL) it looks like :
POST /start?f=2021-02-09_14;05;40&ft=1612879543815&t=1614183852864 undefined
Notice the "undefined" protocol information
I wonder what can produce such a difference knowing that :
The computer are the same 'Asus ZenBook'
Navigator are the same : Mozilla Firefox 85.0.2 (32 bits)
Network drivers are the same
Client and Server code are the same.
This is very strange behaviour.
Many thanks for any precious piece of information !
We find out that this behaviour was a side effect of a DOM exception caused by registering activeX filters. Our application also tried to load video with calls to :
navigator.mediaDevices.getUserMedia({video: { deviceId: device.deviceId }})
This was ending in an :
Uncaught DOMException: A network error occured.
Believe me or not, removing activeX filters removes the network error !
We felt into a problem similar to :
NotReadableError: Failed to allocate videosource
If you have a minute, I am making an XHR request against a Tomcat servlet which returns an XML stream. I have been looking at the scale of converting from ActiveX MSXML to XHR. I incorporated promises as ActiveX was synch while XHR is async. The return XML is voluminous but the XHR request has no problem in IE 11. Edge seems to hang and stops execution. Nothing happens. Another "smaller" XHR request, grabbing the XSL, is fine. The Tomcat log says it handles the request from Edge and sends the response, no problem. Anyway, the code is pretty straightforward. Thank you very much.
xmldoc = new XMLHttpRequest();
return new Promise(function(resolve, reject) {
setTimeout(function() {
xmldoc.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
alert(xmldoc.responseText);
resolve(xmldoc);
}
};
xmldoc.open("GET", url, true);
xmldoc.send();
}, 200);
});
After figuring out how to debug in Edge, this turned out to be CORS filter error from Tomcat. I set the filter in web.xml, with a specific cors.allowed.origins. tomcat.apache.org/tomcat-9.0-doc/config/filter.html#CORS_Filter
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?
I have a problem while writing a Firefox WebExtension add-on. The following code doesn't return any data (responseText is empty), even when the request status equals 4. In Chrome, everything is working perfectly.
I checked even on Fiddler and I can see the request is processed (and we got a response) but it looks Firefox cannot read it?
var xhr = new XMLHttpRequest();
xhr.open('GET', "http://pi.com//", true);
xhr.withCredentials = true;
xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");
xhr.send(null);
xhr.onreadystatechange = processRequest;
function processRequest(e) {
if (xhr.readyState == 4) {
console.log(xhr.responseText);
}
};
I really have no clue why Firefox is not getting the responseText filled. I already checked it with different websites, but everywhere it's the same.
In your manifest.json try adding the key "permissions": ["http://pi.com/"]
I was dealing with exactly the same problem, when porting my extension from Chrome to Firefox, it was driving me crazy!
In my case it was as simple as the mailformed URL.
Instead of http://example.com/ I had to state http://www.example.com/
This question already has answers here:
Cross origin requests are only supported for HTTP but it's not cross-domain
(9 answers)
Closed 7 years ago.
I have been using an HTTP request in a JS file to retrieve information from a local JSON file. It works just fine on my Windows computer in Firefox and Chrome, but when run on a Mac, the Chrome debugger throws an error saying that Cross origin requests are only supported for HTTP...
My HTTP request code is as follows:
var xhr = new XMLHttpRequest();
xhr.open("GET", "sample.json", true);
xhr.onreadystatechange = function() {
if (xhr.readyState === 4) {
var status = xhr.status;
if ((status >= 200 && status < 300) || status === 305) {
var myData = JSON.parse(xhr.responseText);
window.myData = myData;
showAll(myData);
}
}
};
xhr.send(null);
Any ideas? Thanks
Yes, this is a security issue. You need to run this on a server, and the file:/// protocol is not supported for such kind of requests! AJAX is a proper HTTP request response kind of concept and you cannot use file:/// protocol or use different protocols for the transaction.