Existe una API que tiene varios métodos para solicitarle datos, entre ellos, un método me entrega la lista de códigos de órdenes de trabajo que se ingresaron en una fecha determinada para un cliente específico.
api.ot/ot.json?fecha=26062018&CodigoCliente=100448&ticket=A8537A18-6766
El ticket es sólo un token para validar la petición por parte de la API. Esta lista de órdenes de trabajo la almaceno en un arreglo.
Una vez que tengo la lista de órdenes de trabajo, consulto la API con otro método, el cual me entrega el detalle de cada orden de trabajo recuperada en la consulta anterior.
api.ot/ot.json?codigo="+ot[j]+"&ticket= A8537A18-6766
En donde ot[j]
es una orden de trabajo almacenada en la primera consulta.
Ambas peticiones las hago con Ajax y la situación que me tiene complicado es:
1) La primera consulta Ajax retorna correctamente las órdenes de trabajo, las cuales se almacenan en un arreglo ot[]
.
2) Cuando hago las consultas de los detalles de cada orden de trabajo, la API me devuelve el siguiente mensaje
“Lo sentimos. Hemos detectado que existen peticiones simultaneas”.
La implementación es la siguiente:
<!DOCTYPE html>
<html>
<head>
<script
src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function()
{
$("#btn_nuevo").click(function()
{
var ocs=[];
var total=0;
//SE OBTIENEN LAS ORDENES DE TRABAJO
$.ajax(
{
url: "http://api.ot/ot.json?fecha=26062018&CodigoCliente=100448&ticket=A8537A18-6766",
dataType: "json",
success : function(data)
{
total=data.Cantidad;
//SE ALMACENAN LAS OT
for (var i = 0; i < total; i++)
{
ot[i+1]=data.Listado[i].Codigo;
};
//SE RECUPERA EL DETALLE DE LAS OT
for (var j = 0; j < total ; j++)
{
var url="http://api.ot/ot.json?codigo="+ot[j]+"&ticket= A8537A18-6766";
$.ajax(
{
url: url,
dataType: "json",
success : function(datos)
{
$('#result').append('<b>Codigo: </b>' + datos.Listado[0].Codigo +'<br />');
$('#result').append('<b>Nombre: </b>' + datos.Listado[0].Nombre +'<br />');
$('#result').append('<b>Estado: </b>' +datos.Listado[0].Estado +'<br />');
$('#result').append('<b>Descripcion: </b>' + datos.Listado[0].Descripcion +'<br />');
$('#result').append('<b>Tipo: </b>' + datos.Listado[0].Tipo +'<br />');
},
}
);
};
}
}
);
});
});
</script>
</head>
<body>
<div id="boton_nuevo" align="center">
<input type="button" id="btn_nuevo" name="btnnuevo" value="Extraer">
</div>
<div id="result"></div>
</body>
</html>
La respuesta de la API para la primera consulta Ajax está correcta, trayendo la lista de las órdenes de trabajo, pero cuando se comienzan a enviar las consultas de los detalles de las órdenes de trabajo, aparece un "500 Internal Server Error"
y la respuesta que llega es:
{"Codigo":10500,"Mensaje":"Lo sentimos. Hemos detectado que existen peticiones simultáneas."}
Cómo se puede solucionar esta situación, entendiendo que lo que se requiere recuperar es el detalle de cada orden de trabajo.
En base al aporte de Pablo Lozano, hice las modificaciones:
<!DOCTYPE html>
<html>
<head>
<script
src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function()
{
$("#btn_nuevo").click(function()
{
var ocs=[];
var total=0;
$('#result').append('<b>total 1: </b>' + total +'<br />');
//ESTE PRIMER AJAX OBTIENE LA LISTA DE OT
$.ajax({
url: "http://api.ot/ot.json?fecha=26062018&CodigoCliente=100448&ticket=A8537A18-6766",
dataType: "json",
success : function(data)
{
//TOTAL DE OT
total=data.Cantidad;
//SE ALMACENAN LAS OT
for (var i = 0; i < total; i++)
{
ocs[i+1]=data.Listado[i].Codigo
};
//APORTE DE PABLO LOZANO
var promise;
var j = 0
var url = "http://api.ot/ot.json?codigo="+ot[j]+"&ticket= A8537A18-6766";
for (var j = 0; j < total ; j++)
{
if(j=0)
{
promise = promise || $.ajax({ url: url, dataType: "json"});
j++
}
else
{
promise = promise.then(datos => {
$('#result').append('<b>Codigo: </b>' + datos.Listado[0].Codigo + '<br />');
$('#result').append('<b>Nombre: </b>' + datos.Listado[0].Nombre + '<br />');
$('#result').append('<b>Estado: </b>' + datos.Listado[0].Estado + '<br />');
$('#result').append('<b>Descripcion: </b>' + datos.Listado[0].Descripcion + '<br />');
$('#result').append('<b>Tipo: </b>' + datos.Listado[0].Tipo + '<br />');
url = "http://api.ot/ot.json?codigo="+ot[j]+"&ticket= A8537A18-6766";
return $.ajax({url: url, dataType: "json",});
})
}
};
}
});
});
});
</script>
</head>
<body>
<div id="boton_nuevo" align="center">
<input type="button" id="btn_nuevo" name="btnnuevo" value="Ejecutar">
</div>
<div id="result"></div>
</body>
</html>
Al ejecutar arroja el siguiente error:
TypeError: promise is undefined
Cómo codifico la implementación de promise en Jquery?