Synchronous XMLHttpRequest warning and <script>
Solution 1:
UPDATE:
This has been fixed in jQuery 3.x.If you have no possibility to upgrade to any version above 3.0, you could use following snippet BUT be aware that now you will lose sync behaviour of script loading in the targeted content.
You could fix it, setting explicitly async option of xhr request to true:
$.ajaxPrefilter(function( options, original_Options, jqXHR ) {
options.async = true;
});
Solution 2:
Browsers now warn for the use of synchronous XHR. MDN says this was implemented recently:
Starting with Gecko 30.0 (Firefox 30.0 / Thunderbird 30.0 / SeaMonkey 2.27)
https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/Synchronous_and_Asynchronous_Requests#Synchronous_request
Here's how the change got implemented in Firefox and Chromium:
- https://bugzilla.mozilla.org/show_bug.cgi?id=969671
- http://src.chromium.org/viewvc/blink?view=revision&revision=184788
As for Chrome people report this started happening somewhere around version 39. I'm not sure how to link a revision/changeset to a particular version of Chrome.
Yes, it happens when jQuery appends markup to the page including script tags that load external js files. You can reproduce it with something like this:
$('body').append('<script src="foo.js"></script>');
I guess jQuery will fix this in some future version. Until then we can either ignore it or use A. Wolff's suggestion above.
Solution 3:
Even the latest jQuery has that line, so you have these options:
- Change the source of jQuery yourself - but maybe there is a good reason for its usage
- Live with the warning, please note that this option is deprecated and not obsolete.
- Change your code, so it does not use this function
I think number 2 is the most sensible course of action in this case.
By the way if you haven't already tried, try this out: $.ajaxSetup({async:true});, but I don't think it will work.
Solution 4:
I was plagued by this error message despite using async: true. It turns out the actual problem was using the success method. I changed this to done and warning is gone.
success: function(response) { ... }
replaced with:
done: function(response) { ... }