1

Is there any way to avoid below warning by jQuery?

Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check https://xhr.spec.whatwg.org/.

My code is given below:

var url = '../Order/GetOrderDetails' 
$("#divOrder").load(url);

Note: I am using jQuery 2.2.0 version

4b0
  • 21,981
  • 30
  • 95
  • 142
Satheesh M
  • 13
  • 4
  • 1
    My [SO answer](https://stackoverflow.com/a/68219199/5411817) may or may not help some people reading this post, though it addresses a slightly different deprecation warning (*jQuery.fn.load() is deprecated*). And here is the webpage that helped address the issue I was looking for: https://beamtic.com/fn-load-is-deprecated-wordpress. It addresses the jQuery deprecation of `fn.load()` with favor to `on('load', fn)` and similar deprecations. – SherylHohman Jul 02 '21 at 03:23
  • These similar looking questions have several solutions you can look into: https://stackoverflow.com/questions/27736186/jquery-has-deprecated-synchronous-xmlhttprequest AND https://stackoverflow.com/q/28322636/5411817 – SherylHohman Jul 02 '21 at 03:32

1 Answers1

0

You should be using $.ajax(). It looks like $.load() uses synchronous AJAX, which freezes the browser's main thread while the server is preparing and returning a response. As the warning says, that's horrible for user experience.

robinsax
  • 1,195
  • 5
  • 9
  • Isn't `.load()` a [short-hand method](http://api.jquery.com/load/) for `.ajax()`? – Álvaro González Dec 26 '18 at 08:11
  • I tried $.ajax and in success i assigned data in to div using .html(). Then it says fn.html is deprecated. – Satheesh M Dec 26 '18 at 10:35
  • `$.html` is dangerous because is exposes you to XSS vulnerabilities. You'll want to use `$.text`. – robinsax Dec 26 '18 at 19:45
  • @ÁlvaroGonzález apparently it's synchronous in `2.2.0` – robinsax Dec 26 '18 at 19:46
  • 2
    Ah... I really hate documentation that doesn't take versions into account :( – Álvaro González Dec 27 '18 at 07:35
  • I made the changes as given below before the ajax call and now warning got removed. $.ajaxPrefilter(function( options, original_Options, jqXHR ) { options.async = true; });Please refer https://stackoverflow.com/questions/28322636/synchronous-xmlhttprequest-warning-and-script/28323156#28323156 – Satheesh M Dec 28 '18 at 05:41