API Access HTML / Javascript Problem

Question

API Access HTML / Javascript Problem

4

171 2019-03-24

Eutenho umproblematentando usar o JavaScriptpara obter a oferta circulante solicitando dados da API Tzscan:

Código HTMLpara solicitar ofornecimento de circulação:

 <!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
  <h1>There Tezos Circulating : </h1>
  <div id="getapi"></div>
</body>
</html>

Código Javascriptpara obter os dados da API:

 <script>
  function createNode(element) {
    return document.createElement(element);
  }

  function append(parent, el) {
    return parent.appendChild(el);
  }

  const ul = document.getElementById('getapi');
  const url = 'http://api6.tzscan.io/v3/supply';
  fetch(url)
    .then((resp) => resp.json())
    .then(function(data) {
      let span = createNode('span');
      span.innerHTML = `${data.circulating_supply/1000000}`;
      append(ul, span);
    })
    .catch(function(error) {
      console.log(error);
    }); 
 </script>

Oproblema é que de algumaformafunciona quandoeu crio um arquivo html localmente,masnão online .

I have an issue trying to use javascript to get the circulating supply by requesting data from Tzscan API:

HTML code to request the circulating supply:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
  <h1>There Tezos Circulating : </h1>
  <div id="getapi"></div>
</body>
</html>

Javascript Code to get the data from the API:

<script>
  function createNode(element) {
    return document.createElement(element);
  }

  function append(parent, el) {
    return parent.appendChild(el);
  }

  const ul = document.getElementById('getapi');
  const url = 'http://api6.tzscan.io/v3/supply';
  fetch(url)
    .then((resp) => resp.json())
    .then(function(data) {
      let span = createNode('span');
      span.innerHTML = `${data.circulating_supply/1000000}`;
      append(ul, span);
    })
    .catch(function(error) {
      console.log(error);
    }); 
 </script>

The problem is that somehow it works when I create a HTML file locally but not online.

fonte
Lexxor

- Isso ajudarátambém aincluir oserros que vocêestá recebendo.Eu sei queprovavelmentepoderíamos olharpara o seu codepen,maspor causa da questão,émelhorincluir oserrosnapergunta.
  
  it'll help to also include the errors you are getting. I know we could probably look at your codepen but for the sake of the question, it's best include the errors in the question.
  - 0
  - 2019-03-25
  - Frank

1 responda

votos

Richard Ayotte · Accepted Answer · 2019-03-24

7

2019-03-24

Vocêencontrou umerro de conteúdomisto.As solicitaçõesnãopodem ser umamistura de HTTPe HTTPS,elesprecisam sertodosiguais,preferencialmente https.Basta alterar o const url = 'http://api6.tzscan.io/v3/supply';para ser http s

 const url = 'https://api6.tzscan.io/v3/supply';

fetch(url)
.then(resp => resp.json())
.then(({dls}) => {
    let span = createNode('span');
    span.innerHTML = dls;
    append(ul, span);
})
.catch(console.log);

You've encountered a mixed content error. Requests can't be a mixture of http and https, they need to be all of the same, preferably https. Just change the const url = 'http://api6.tzscan.io/v3/supply'; to be https

const url = 'https://api6.tzscan.io/v3/supply';

fetch(url)
.then(resp => resp.json())
.then(({dls}) => {
    let span = createNode('span');
    span.innerHTML = dls;
    append(ul, span);
})
.catch(console.log);