Fetch data fron api and display on html JS-CodePudding

i am trying to get the data from this api https://js.cexplorer.io/api-static/basic/global.json

here is my code

<script>
    
fetch('https://js.cexplorer.io/api-static/basic/global.json').then((data)=>{
    return data.json();
}).then ((completedata)=>{
    
    let data1="";
    completedata.map((values)=>{
        data1=`
        <div >
          <h3>Epoch</h3>
          <p>${values.epochNo}</p>
        </div>`
    });
    document.getElementById("live1").innerHTML=data1;
}).catch((err)=>{
    console.log(err);
})
</script>

on google console i see this error: TypeError: completedata.map is not a function i don't understand where is the problem.. because with the same code but this api https://api.coinlore.net/api/ticker/?id=257 works fine, where is the differece? thanks for any reply!

CodePudding user response：

the API on URL https://js.cexplorer.io/api-static/basic/global.json returns object ({}) and not an array ([]). That is why the map function does not exist.

CodePudding user response：

Not sure if that's the solution you are looking for, but it should work :)

fetch("https://js.cexplorer.io/api-static/basic/global.json")
.then((res)=> res.json())
.then((res)=> console.log(res.data.epoch.start_time))```