JavaScript console.log causa errore: "Synchronous XMLHttpRequest sul thread principale è deprecato..."

Questo mi è successo quando sono stato pigro e ho incluso un tag script come parte del contenuto che veniva restituito. Come tale:

Contenuto HTML parziale:

<div> 
 SOME CONTENT HERE
</div>
<script src="/scripts/script.js"></script> 

Sembra, almeno nel mio caso, che se restituisci un contenuto HTML come quello via xhr, causerai una chiamata a jQuery per ottenere quello script. Quella chiamata avviene con un flag async false in quanto presuppone che tu abbia bisogno dello script per continuare il caricamento.

In situazioni come questa sarebbe meglio cercare un framework di binding di qualche tipo e semplicemente restituire un oggetto JSON, o a seconda del tuo backend e dei tuoi template potresti cambiare il modo in cui carichi i tuoi script.

Potresti anche usare jQuery's getScript() per prendere gli script rilevanti. Qui c'è un fiddle, è solo una copia diretta dell'esempio di jQuery, ma non sto vedendo alcun avvertimento lanciato quando gli script vengono caricati in questo modo.

Esempio

<script>
var url = "/scripts/script.js";
$.getScript(url);
</script>

[http://jsfiddle.net/49tkL0qd/][1]

Il messaggio di avvertimento POTREBBE essere dovuto a una richiesta XMLHttpRequest all'interno del thread principale con il flag async impostato su false.

https://xhr.spec.whatwg.org/#synchronous-flag:

XMLHttpRequest sincrono al di fuori dei worker è in fase di essere rimosso dalla piattaforma web in quanto ha effetti dannosi per l'esperienza dell'utente finale. (Questo è un lungo processo che richiede molti anni). Gli sviluppatori non devono passare false per l'argomento async quando l ambiente globale JavaScript è un ambiente documento. Gli agenti utente sono fortemente incoraggiati ad avvertire di tale uso negli strumenti di sviluppo e possono sperimentare il lancio di un'eccezione InvalidAccessError quando si verifica.

La direzione futura è di permettere solo XMLHttpRequests nei threads dei lavoratori. Il messaggio vuole essere un avvertimento in tal senso.

Stavo anche affrontando lo stesso problema ma sono riuscito a risolverlo mettendo async: true. So che è di default true ma funziona quando lo scrivo esplicitamente

$.ajax({
   async: true,   // this will solve the problem
   type: "POST",
   url: "/Page/Method",
   contentType: "application/json",
   data: JSON.stringify({ ParameterName: paramValue }),
});