Why does Firefox seem to be the only browser that doesn't throw an error when performing a synchronous request? Any insights on this peculiar behavior?
// Ensure your JS console is open when running this script
var url = '//api.soundcloud.com/resolve.json?url=http://soundcloud.com/matas/hobnotropic&client_id=83f67039ae0c3790030d256cb9029678';
var xhr = new XMLHttpRequest();
xhr.open('GET', url, false); // SYNCHRONOUS
xhr.onload = alert.bind(null, 'Loaded');
xhr.send(null);When performing a similar asynchronous XMLHttpRequest, no errors are thrown, and the request executes as expected:
// Make sure to have your JS console open when you run this
var url = '//api.soundcloud.com/resolve.json?url=http://soundcloud.com/matas/hobnotropic&client_id=83f67039ae0c3790030d256cb9029678';
var xhr = new XMLHttpRequest();
xhr.open('GET', url, true); // ASYNCHRONOUS
xhr.onload = alert.bind(null, 'Loaded');
xhr.send(null);Based on my understanding:
- The SoundCloud API returns relevant CORS headers.
- The SoundCloud resolve API initiates a 302 redirect to
.http://api.soundcloud.com/tracks/49931.json - If the request is conducted asynchronously, it navigates through the redirect successfully and completes.
- If the request is executed synchronously, it fails with various errors in browsers like Chrome, Opera, and Safari, but not in Firefox. The errors include:
- Chrome: "NetworkError: A network error occurred."
- Opera: "NetworkError: A network error occurred."
- Safari: "XMLHttpRequest Exception 101: A network error occurred in synchronous requests."
Can someone clarify why the synchronous request fails? What causes this discrepancy in behavior between synchronous and asynchronous requests? Is it attributed to a specific bug in Firefox or in the WebKit/Blink engines?
Edit: I've reported an issue on Chrome's bug tracker as there seems to be no definite explanation for this behavior in specifications. A similar issue may be raised for WebKit in due course.