I'm currently working on developing a frontend application using Javascript Fetch to interact with an API service.
One of the tasks I need to accomplish is to create a token by using the POST method and sending an apiKey parameter in the Body. Once I have the token, I then need to make another POST request with the token along with date parameters: StartDate and currentDate to fetch some data.
Here's how it appears in Postman (Token Request):
https://i.stack.imgur.com/npNuu.png
Data Request (Sending token): https://i.stack.imgur.com/wIbq0.png
This is my progress so far:
<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>
Any assistance or suggestions would be greatly appreciated!