PHP - Seguir navegando mientras se ejecuta consulta

 
Vista:

Seguir navegando mientras se ejecuta consulta

Publicado por Jorge (48 intervenciones) el 21/04/2021 19:13:14
Hola,

Tengo una consulta en MySQL que le lleva minutos de ejecución, ¿hay forma de ejecutarla como en segundo plano?

La consulta se ejecuta a través de un formulario con los filtros que ha indicado el usuario. La tabla madre del cordero tiene 180.000 registros y la consulta tiene left join de esa tabla con otras dos. Cuando lanza la consulta el usuario debe esperar a que esta termine de ejecutar. ¿Hay manera de que el usuario pueda navegar por la app y cuando esa consulta termine de ejecutar se muestre los resultados en una ventana nueva?

¿Cómo puedo hacerlo? Gracias de antemano!

Saludos.
Jorge
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
sin imagen de perfil
Val: 393
Ha mantenido su posición en PHP (en relación al último mes)
Gráfica de PHP

Seguir navegando mientras se ejecuta consulta

Publicado por Jefferson (203 intervenciones) el 21/04/2021 23:22:48
Hola Jorge

Para eso se actualizo JS y con API Fetch haces la promesa y como se trata de una promesa, se sigue ejecutando el codigo javascript del lado del cliente en un proceso sincrónico normalmente.

Es decir.
Jquery, php y otros tantos lenguajes trabajan por bloques
quiere decir
1
2
3
4
if(...) //se ejecuta la condicional y sigue a la siguiente instrucción
if(...) //se ejecuta la condicional y sigue a la siguiente instrucción
if(...) //se ejecuta la condicional y sigue a la siguiente instrucción
if(...) //se ejecuta la condicional y sigue a la siguiente instrucción

Cuando realizas peticiones Fetch
1
2
3
4
5
fetch('pagina.php')
  .then(response => response.json())
  .then(data => console.log(data));
 
   if(...) //se ejecuta la condicional y sigue a la siguiente instrucción

Fijate que primero se realiza la petición, mas sin embargo la condicional la toma sin ningún problema y el codigo JS sigue su curso normal


https://developer.mozilla.org/es/docs/Web/API/Fetch_API/Using_Fetch

Saludos
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

Seguir navegando mientras se ejecuta consulta

Publicado por Jorge (48 intervenciones) el 22/04/2021 08:34:45
Buenos días Jefferson,

En primer lugar gracias por tus comentarios.

Entiendo que el fetch debo incluirlo en el botón que llama a la página que tiene la consulta sql, ¿si?

Actualmente tengo "formularioFiltros.php" con un botón de tipo submit que al pulsarlo lleva a "informe.php" donde recupera los valores por post, ejecuta la consulta sql y muestra el resultado en un datatable.

Y los .then, ¿debo incluirlos así tal cual cómo tú me indicas?
Para la Api, ¿debo instalar algo o incluir algún link href en el head?

Gracias de antemano.

Saludos.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 393
Ha mantenido su posición en PHP (en relación al último mes)
Gráfica de PHP

Seguir navegando mientras se ejecuta consulta

Publicado por Jefferson (203 intervenciones) el 24/04/2021 04:36:50
Hola amigo y disculpa la tardanza en responder, pasa que tengo demasiado trabajo y tú entenderas.

Al botón submit quítale el atributo type y déjalo normal buttom. Y le asignas un ID

Luego en el script Invocas al método de ataque
addEventListener y como imagino el submit lo tienes en un form también debes evitar el action nativo en HTML con preventDefault. Y listo

Hagamos algo te prepararé un ejemplo y te mostrare como hacerlo
Saludos
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil
Val: 393
Ha mantenido su posición en PHP (en relación al último mes)
Gráfica de PHP

Seguir navegando mientras se ejecuta consulta

Publicado por Jefferson (203 intervenciones) el 24/04/2021 22:13:55
Volvimos

Como te explicaba Fetch no trabaja por bloques.
A continuación mira este código

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
document.addEventListener('DOMContentLoaded', function () {
  frm_fetch('carpeta/archvo.php',formID).then((retorna) => { console.log(retorna);})
  JsonPost('carpeta/pagina.php',{ 'valor': valor, 'clave': clave } ,dev => { console.log(dev); });
  LoadOn('carpeta/pagina.php', div);
});
async function frm_fetch(pag, DivID) {
  const opciones = {
    method: 'POST',
    body: new FormData(frm)
  };
  try {
    const fetchResp = await fetch(pag, opciones);
    const retorna = await fetchResp.text();
    return retorna;
  } catch (e) {
    return e;
  }
}
async function JsonPost(url, valor, callback) {
  return await fetch(url, {
    method: 'POST',
    body: JSON.stringify(valor),
    headers: { 'Content-Type': 'application/json' }
  })
    .then(res => res.json())
    .then(ret => callback(ret));
}
function LoadOn(pag, div) {
  fetch(pag)
    .then(datos => datos.text()).then(datos => {
      div.innerHTML = datos;
    })
}

Primero deberia ejecutarse la funcion
frm_fetch luego
JsonPost y por ultimo
LoadOn

Pero no sucede así, ellas se ejecutan una detrás de otra y van mostrando el resultado quien primero lo obtenga, sin importar el orden.

Si queremos que trabajen en secuencia y respetando el orden, deberíamos hacerlo así

1
2
3
4
5
6
7
8
9
document.addEventListener('DOMContentLoaded', function () {
  frm_fetch('carpeta/archvo.php',formID).then((retorna) => {
    console.log(retorna);
    JsonPost('carpeta/pagina.php',{ 'valor': valor, 'clave': clave } ,dev => {
       console.log(dev);
       LoadOn('carpeta/pagina.php', div);
    });
  })
});

Así se ejecutan una a una respetando el orden.

Como debes invocar la llamada a la api fetch ?

1
2
3
4
5
6
7
8
9
10
11
12
13
<form id="frm">
   <input name="nombre">
   <input name="apellido">
   <button id="boton">enviar</button>
</form>
<script>
boton.addEventListener('click', (e) => {
    e.preventDefault();
    frm_fetch('carpeta/archvo.php',frm).then((retorna) => {
      console.log(retorna);
    })
});
</script>

Preguntas porque los then si deben ir así...?
Te explico: En el idioma ingles then = luego, despues, lo que sigue.

Quiere decir que la api trabaja de esa manera
primero fetch usa el protocolo http para enviar la información
then (despues) nos retorna una promesa que debemos indicarle como la recibiremos (json, text, blob, etc..)
then (despues) esa promesa debemos tratarla como un funcion y obtener de ella lo que estemos buscando.
y si quieres agregarle la funcion que te atrapa errores debes llamar a catch

1
2
3
4
5
6
7
8
fetch(pag)
    .then(datos => datos.text())
    .then(datos => {
      console.log(datos);
    })
    .catch(function(error) {
         console.log('Hubo un problema con la petición Fetch:' + error.message);
    });

Bueno amigo espero haberte ayudado un poco
Saludos
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
-1
Comentar