Tengo un problema con una gran solicitud de ajax: hago una consulta en un archivo php que hace una solicitud de curl, tarda entre 15 y 20 segundos en completarse, luego devuelvo algo de json en mi página web. Es una solicitud clásica de ajax, pero descubrí un error extraño,
Cuando se ejecuta la consulta ajax (escriba GET), no puedo usar mi sitio web en Chrome, todas las páginas permanecen en blanco hasta que se completa la solicitud ajax,
Así que pensé que la solicitud de ajax había roto mi servidor, pero el sitio funciona perfectamente en otros dispositivos (móvil, otra sesión de Chrome, ...). Solo la sesión actual de Chrome se vuelve lenta y funciona solo cuando se completa la solicitud de ajax.
¿Podría explicarme por qué? Mi solicitud de ajax es básica:
$.ajax({ url: '/controller.php', type: 'GET', dataType: "json", data: { action: "loadPageContent" }, success: function(retour) { localStorage.removeItem('myhtml'); if(retour.status && retour.htmlDatas){ storedDatas["posts"] = retour.htmlDatas; storedDatas["date_scrapping"] = retour.date_scrapping; localStorage.setItem("myhtml", JSON.stringify(storedDatas) ); // ¨Pour si relance $('#container').html(retour.htmlDatas); } else { alert('error'); } }, error: function(retour) { alert('error'); }, });use la promesa y maneje la respuesta:
async function runCodes(){ //this code its gonna run async ajaxCall().then((response)=>{ if(response){ //true } else { //false } }); //some other codes } function ajaxCall(){ return new Promise((resolve) => { $.ajax({ url: '/controller.php', type: 'GET', dataType: "json", data: { action: "loadPageContent" }, success: function(retour) { localStorage.removeItem('myhtml'); if(retour.status && retour.htmlDatas){ storedDatas["posts"] = retour.htmlDatas; storedDatas["date_scrapping"] = retour.date_scrapping; localStorage.setItem("myhtml", JSON.stringify(storedDatas) ); // ¨Pour si relance $('#container').html(retour.htmlDatas); resolve(true); } else { alert('error'); resolve(false); } }, error: function(retour) { alert('error'); resolve(false); }, }); }); }