We Keep Coding

NS_BINDING_ABORTED only on first PUT attempt in Firefox

In my JS single page web app I have a reset-button that triggers 'onclick' and will use vanilla fetch() to PUT an empty JSON array to my API. Both are hosted on the same domain/server. When using Firefox (currently 86.0), the first time I push the reset button, the call is aborted. The console says NetworkError when attempting to fetch resource white the Network tab says NS_BINDING_ABORTED in the transferred column.
When I reload my app (F5) and push the same button again, it works. And also any time from now on. As the same code is executed, the failing and the working calls would send the same headers and payload.
Chrome does not show this behavior, there the first call works too.
Even stranger, this first failing PUT call in Firefox seems to only fail once per URL. The web app provides "areas" to users with the area ID in the frontend URL, e.g.
https://example.org/areas/#/myAreaA
and
https://example.org/areas/#/myAreaB
These will PUT to the API, which also has these IDs in their URLs:
https://example.org/api/areas/myAreaA/state/
and
https://example.org/api/areas/myAreaB/state/
For each of these URLs, the first PUT call fails with NS_BINDING_ABORTED but works thereafter. If I copy the URL for such an area into a new Tab or even close+open the Browser again, the Error does not appear again. The web app does not use any cookies.
The web app does a lot of other API calls to the same backend/areaID, no other show this behavior. However, this is the only PUT call, all other calls are GET/POST/HEAD/PATCH requests.
What could be the reason for the first PUT failing?

Following "NetworkError when attempting to fetch resource." only on Firefox I found the problem. It seems that Firefox' onclick event propagation interferes here with the fetch() call. As soon as I added
event.preventDefault()
in the onclick-handler before doing the actual fetch(), everything started to work again.

Check for 200 Response of an XMLHTTP 'Stream' with Javascript

I hope i'm not being docile and missing something simple here but i'm stumped,
I need to check the response of a HTTP stream from the DI.fm audio streaming servers using Javascript for a chrome extension (Attempting to open a HTTP audio stream with a key is the ONLY 100% way to know if a key is valid for premium audio).
My intent is to validate a listen key (listen_key) and on 403 or 401 error, failover to a different URL.
The on error is fine and I can handle that using normal on error listeners, but the issue is that I'm using XMLHttp - So when a key is VALID, the stream begins to buffer without limit, Since it is receiving a HTTP stream. I can't find a way to drop out at this point and do a callback saying 200 OK :)
I don't want to have to set a timeout and failover if no errors within that time, as I want to be 100% certain that the error is Unauthorised. The unauthorised fallback will trigger a whole load of status variable changes for other things on the app.
I need to get the response being 200 and drop out as soon as that is confirmed.
Any other error (no data etc.) already falls back to a 3rd function which tries to reload the URL x number of times.
The element i'm getting this 200 status from can also be grabbed by loading the URL in an audio tag and then destroying the element if that's the only way to do it. Just not sure how to go about it best.
Your help is much appreciated :)
Phil.

queryMySQL.php?query=myquery returns 403 forbidden error sometime

I have created a web site where in one page I select search criteria for mysql.
Depending on the drop-down elements selected, I create a string that I call myquery in a javascript, then I use
window.location.href = "queryMySQL.php?query=" + myquery;
and call a different page.
This works sometimes, but sometimes it gives me the 403 error and the page shows:
You don't have permission to access queryMySQL.php on this server.
Additionally, a 404 Not Found error was encountered while trying to use an ErrorDocument to handle the request.
I cannot figure out why it works sometimes and sometimes it does not, the syntax of the query is not a problem, I can get this error even if I remove the code on the page.
Additionally, this worked fine on another web hosting site, but when I copied this implementation on a different site I started having problems.
Suggestions?
EDIT ******************************************************
As I said this has nothing to do with the query. The target page can be a blank html page, and the error is still there. It looks like some security issue on this web hosting site because it worked fine on the other one and on my own server.

Try:
window.location.href = "queryMySQL.php?query=" + encodeURIComponent(myquery);
The query probably contains special characters that need to be encoded in a URL.

why ie request twice for the UI's html?

I am working on a client server application,in which we open client on our pc by URL:http:\[ip of server]:[port no]. The client's GUI is divided into parts and right click is disabled on left pane.
One of our Customer is getting the error (Java script error at line:36,char:3,Error:object expected,code:0,URL:http:\localhost:6741/content.html), so the right click works on the left pane also which generate the error. The error line is
html.append(" writeAppletObject('appdiv', '").append(
getParameter("javaclsid")).append(
"', '2048', '2048', 'ContentGeneratorApplet', 'ContentGeneratorApplet', inner);" What could be the reason of this error? Customer is saying they opens it first time successfully but afterwards in every attempt they are getting this error...
Note: My application start by using the URL mentioned in IE, and one pop-up comes in which we perform every action of the apllication and original window we can close as they are only for starting. My customer is using IE8 and OS is Xp.
I compared the iehttpheader for both the successful and unsuccessful attempt, I noticed in both the case Two times GET /content.html HTTP/1.1 and GET /startNSM.html HTTP/1.1(part of ui) request is made. In success attempt when second requst is made it is served, but in failure case GET /startNSM.html HTTP/1.1 is served in first request and we are getting the mentioned error in content.html. NOTE:GET /content.html HTTP/1.1 was not served in first request and cause error in second request.
Any help would be greatly appreciated.... Thanks in Advance

AJAX not handling 302 redirect

I have a database on an external server that I am trying to query. To do this, I am going on my local server (Tomcat) and creating an AJAX call (just the XMLHttpRequest object - I am not using any JavaScript libraries) to the page with a query appended. Pasting the exact same URL into Firefox causes it to try to download an XML document. My goal is to use AJAX to get that XML document.
The problem I am having is that when I make the call with AJAX, Firebug shows that the GET response returned 302 "Moved Temporarily" with a red X next to it. The header for the GET response has a Location parameter with OAuth authorization, and when I copy and paste the location parameter it takes me to the correct page (tells me to download the XML object).
EDIT: I tried it using jQuery's $.get("URL", function(data){alert(data)}); and the same thing happened - no alert, but a red GET request and 302 in Firebug.
Based on this information, I think that the database I am calling is first trying to redirect me to some OAuth thing, which then returns an authorized URL with which to access the database. This is what I should use to call the database, get the XML object back, and then do my thing. AJAX doesn't seem to be able to handle the redirect and is instead crashing.
I'm not sure this is correct, however, because I tried using the following code:
else if (xmlhttp.readyState == 4 && xmlhttp.status == 302){
alert("Hello 302!");
}
else {
document.getElementById("test").innerHTML = "On state: " + xmlhttp.readyState + "<br />HTTP Status: " + xmlhttp.status;
}
and it didn't give me an alert - instead it shows that it is on state 4 and status 0. I don't understand why it would return status 0. (Edit: Fixed the typo mentioned in answer 1 and nothing changed)
So my questions are:
What, exactly, is going on here?
What is the 0 status, why is Firebug giving me an X next to 302 in the console, and why isn't there a redirect?
How can I fix this?
Once I do fix it, will I be able to grab that XML file, or is there something else I need to do?
EDIT WITH UPDATE: It's a cross-site scripting issue. I went on the external server and ran the exact same script and was able to retrieve and parse an XML document containing the result of the query. The only obstacle is figuring out how to do this from an external server. I have access to the configuration of the external server and will be researching how to manipulate it to allow access via database queries from other sites.

Since it's an ajax request you can't pull data from another domain: http://en.wikipedia.org/wiki/Same_origin_policy
All you can do here really is request data from your own server (same domain) and have it pull data from the external db for you.
edit: this response is over 3 years old and now with modern browsers (not IE < 10) you can use Cross Origin Resource Sharing - https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS

You have a syntax error readystate needs to be readyState. The way it is written, it will never be 4.
Another piece of advice would be to just check for a readyState of 4 and within that statement test for the status of 302. That way you will be able to troubleshoot whether or not it is the 302 that is causing your issue.

Try to do the redirection on the server side
Snapshot from FireBug
In this snapshot the Ajax request sent to server side (where there is the redirection)