Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

337
Vistas
Javascript Fetch Solicitud de token de API a través del cuerpo

Estoy tratando de construir una interfaz usando Javascript Fetch para comunicarme con un servicio API.

Tengo que generar un token usando el método POST enviando el parámetro apiKey en el Cuerpo, y luego tengo que usar el token generado y enviarlo en otro POST incluyendo los parámetros de fecha: FechaInicio (StartDate), FechaFinal (currentDate) para recuperar datos.

Así es como se ve en Postman (Token de solicitud):

ingrese la descripción de la imagen aquí

Solicitud de datos (envío de token): ingrese la descripción de la imagen aquí

Esto es lo que tengo hasta ahora:

 <div> <table> <thead> <tr> <th>numeroConsecutivo</th> <th>condicionVenta</th> </tr> </thead> <tbody id="data"> </tbody> </table> </div> <script> let url = 'https://www.fakeurl.com/webservices/bills.php';//fake const apiKey = '+%a4Ur734687631';///fake const fechaInicio = "19990101"; //Initial Date var fechaFinal = new Date(); //Get current Date, format: 20220416 var dd = String(fechaFinal.getDate()).padStart(2, '0'); var mm = String(fechaFinal.getMonth() + 1).padStart(2, '0'); //January is 0! var yyyy = fechaFinal.getFullYear(); fechaFinal = yyyy + mm + dd; fetch(url),{ method: 'POST', body: { 'apiKey': (apiKey) } .then(response => response.json())//Get Token .then(token => displayToken(token)) .catch(error => console.log(error)) }, fetch(url),{ method: 'POST', body: { 'token': (token), 'fechaInicio': (fechaInicio), 'fechaFinal': (fechaFinal) } .then(response => response.json()) .then(data => displayData(data)) .catch(error => console.log(error)), const displayData = (data) => { console.log(data) let body = "" for (var i = 0; i < data.length; i++) { body += `<tr><td>${data[i].numeroConsecutivo}</td><td>${data[i].condicionVenta}</td></tr>` } document.getElementById('data').innerHTML = body //console.log(body) } } </script>

¡Cualquier ayuda será muy apreciada!

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

Dado que su segunda solicitud de recuperación depende de la primera, es mejor encadenar la solicitud: realice la segunda solicitud solo después de obtener la respuesta de la primera solicitud.

Luego, si la segunda solicitud tiene éxito, modificamos el DOM . También podemos usar devoluciones de llamada, pero esto es más legible.

 <div> <table> <thead> <tr> <th>numeroConsecutivo</th> <th>condicionVenta</th> </tr> </thead> <tbody id="data"></tbody> </table> </div> <script> let url = 'https://www.fakeurl.com/webservices/bills.php' //fake const apiKey = '+%a4Ur734687631' ///fake const fechaInicio = '19990101' //Initial Date var fechaFinal = new Date() //Get current Date, format: 20220416 var dd = String(fechaFinal.getDate()).padStart(2, '0') var mm = String(fechaFinal.getMonth() + 1).padStart(2, '0') //January is 0! var yyyy = fechaFinal.getFullYear() fechaFinal = yyyy + mm + dd const displayData = (data) => { console.log(data) let body = '' for (var i = 0; i < data.length; i++) { body += `<tr><td>${data[i].numeroConsecutivo}</td><td>${data[i].condicionVenta}</td></tr>` } document.getElementById('data').innerHTML = body //console.log(body) } fetch(url, { method: 'POST', body: { apiKey: apiKey, }, }) .then((response) => response.json()) //Get Token .then((token) => { displayToken(token) return fetch(url, { method: 'POST', body: { token: token, fechaInicio: fechaInicio, fechaFinal: fechaFinal, }, }) }) .then((response) => response.json()) .then(displayData) .catch((error) => console.log(error)) </script>

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda