Ricevo un messaggio di avviso:
XMLHttpRequest sincrono sul thread principale è deprecato a causa dei suoi effetti dannosi sull’esperienza dell’utente finale. Per ulteriori informazioni, consulta http://xhr.spec.whatwg.org/ .
quando si esegue una richiesta AJAX asincrona che contiene uno script (che ha src locale), che viene iniettato in HTML, utilizzando il metodo $.html() . Ho cambiato lo script dato per contenere async="async" , ma il messaggio di avviso rimane ancora.
Ho iniziato il debug del problema per scoprire che il mio aggiunto è gestito tramite jQuery chiamata AJAX da jQuery.ajaxTransport ( http://code.jquery.com/jquery-1.10.0.js , # 8663), dove async è impostato su false (probabilmente è da dove viene il problema).
Ora – cosa posso fare per questo?
Il messaggio viene visualizzato nella versione più recente di Chrome e di Firefox.
Mentre non riesco a fornire un caso di test su jsfiddle, ecco un caso di test che mostra il problema:
test.html
$(document).ready(function(){ $.ajax({ url: '/response.html', success: function(response){ $(document.body).html(response); } }) });
response.html
json.js
console.log('hi');
La richiesta AJAX non è necessaria per triggersre l’avviso: tutto ciò che è necessario è inserire uno
Test2.html
$(document).ready(function(){ $(document.body).html(''); });
Vale la pena notare che questo è stato corretto, per https://github.com/jquery/jquery/issues/2060
AGGIORNAMENTO:
è stato corretto in jQuery 3.x.Se non hai la possibilità di eseguire l’aggiornamento a nessuna versione precedente alla 3.0, potresti utilizzare lo snippet seguente, ma tieni presente che ora perderai il comportamento di sincronizzazione del caricamento degli script nel contenuto scelto come target.
È ansible risolvere il problema impostando esplicitamente l’opzione asincrona della richiesta xhr su true :
$.ajaxPrefilter(function( options, original_Options, jqXHR ) { options.async = true; });
I browser ora avvisano per l’uso di XHR sincrono. MDN dice che questo è stato implementato di recente:
A partire da Gecko 30.0 (Firefox 30.0 / Thunderbird 30.0 / SeaMonkey 2.27)
Ecco come la modifica è stata implementata in Firefox e Chromium:
Per quanto riguarda le persone di Chrome, questo ha iniziato a verificarsi intorno alla versione 39. Non sono sicuro di come colbind una revisione / changeset a una versione particolare di Chrome.
Sì, succede quando jQuery aggiunge il markup alla pagina, inclusi i tag di script che caricano file js esterni. Puoi riprodurlo con qualcosa di simile a questo:
$('body').append('');
Immagino che jQuery risolverà questo in alcune versioni future. Fino ad allora possiamo o ignorarlo o usare il suggerimento di A. Wolff sopra.
Anche l’ ultimo jQuery ha quella linea, quindi hai queste opzioni:
Penso che il numero 2 sia la linea di condotta più sensata in questo caso.
A proposito, se non lo hai ancora provato, prova questo: $.ajaxSetup({async:true}); , ma non penso che funzionerà.
Sono stato afflitto da questo messaggio di errore nonostante l’utilizzo di async: true. Risulta che il vero problema stava usando il metodo di success . L’ho modificato e l’avviso è sparito.
success: function(response) { ... }
sostituito con:
done: function(response) { ... }
Nel mio caso ciò è stato causato dallo script flexie che faceva parte dell’app “CDNJS Selections” offerta da Cloudflare .
Secondo Cloudflare “Questa app è stata ritirata a marzo 2015”. L’ho spento e il messaggio è scomparso all’istante.
Puoi accedere alle app visitando https://www.cloudflare.com/a/cloudflare-apps/yourdomain.com
se hai solo bisogno di caricare script non fare come sotto
$(document.body).html('
Prova questo
var scriptEl = document.createElement('SCRIPT'); scriptEl.src = "/module/script/form?_t="+(new Date()).getTime(); //$('#holder').append(scriptEl) // <--- create warning document.body.appendChild(scriptEl);