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/.

Question

User351619809 posted

I am working one of the old web site that is using Jquery 1.11.0. I am using MaskEditExtender on my web page and I keep getting this error:

jquery-1.11.0.js:9628 [Deprecation] 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/.

I drilled down into Jquery and noticed the error was coming in Jquery 1.11.0.js file at this line

xhr.open( options.type, options.url, options.async, options.username, options.password );

Error says "Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience."

I saw in some stackoverflow and github post that if I set async to true then the issue will be resolved so I did this:

jQuery._evalUrl = function (url) {
        
    return jQuery.ajax({
        url: url,
        type: "GET",
        dataType: "script",
        async: true,
        global: false,
        "throws": true
    });
};

when I did this a new error started coming:

VM24:3 Uncaught Error: ASP.NET Ajax client-side framework failed to load.
    at eval (eval at <anonymous> (jquery-1.11.0.js:339), <anonymous>:3:40)
    at eval (<anonymous>)
    at jquery-1.11.0.js:339
    at Function.globalEval (jquery-1.11.0.js:340)
    at jQuery.fn.init.domManip (jquery-1.11.0.js:5931)
    at jQuery.fn.init.append (jquery-1.11.0.js:5704)
    at jQuery.fn.init.jQuery.fn.<computed> [as appendTo] (jquery-1.11.0.js:5962)
    at $.<computed>.<computed>._include (jquery.mobile-1.4.5.js:4881)
    at $.<computed>.<computed>._include (jquery.mobile-1.4.5.js:835)
    at $.<computed>.<computed>.<anonymous> (jquery.mobile-1.4.5.js:5095)

Below is the screen shot:

have the following in my web.config file:

<controls>
        <add assembly="Microsoft.AspNet.Web.Optimization.WebForms" namespace="Microsoft.AspNet.Web.Optimization.WebForms" tagPrefix="webopt" />
      <add tagPrefix="ajaxToolkit" assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" />
        <add assembly="BotDetect" namespace="BotDetect.Web.UI" tagPrefix="BotDetect" /></controls>

I have this under httpHandlers

<httpHandlers>
			<!-- Simple API: Register the HttpHandler used for BotDetect requests -->
     <add verb="GET" path="ScriptResource.axd" type="Microsoft.Web.Handlers.ScriptResourceHandler" validate="false"/>
</httpHandlers>

I have been working on this issue for hours. I also tried upgrading Jquery to 3.X, but that removes all the styling on the page. I have several pages on this web site.

Any help or hint will be highly appreciated.

Answer 1

User475983607 posted

XMLHttpRequest is a browser API that cannot be fixed by changing jQuery.

Remove the following from the AJAX function.

async: true,

Then fix your JavaScript/jQuery code to function asynchronously. 

Answer 2

User288213138 posted

Hi anjaliagarwal5,

VM24:3 Uncaught Error: ASP.NET Ajax client-side framework failed to load.

You can also try the following steps to solve your problem.

1.Try to delete files from your "bin" folder and rebuild the solution and clear the cache of your browser.

2.Add this to your web.config.

<location path="ScriptResource.axd">
   <system.web>
      <authorization>
         <allow users="*"/>
      </authorization>
   </system.web>
</location>

Best regards,

Sam