Você vai aprender neste artigo como consumir dados de uma API pública para obter o valor da cotação do dólar com JavaScript.

O consumo desta API será feito apenas com JavaScript, sem utilizar nenhuma biblioteca.

O Banco Central do Brasil possui um site chamado "dados abertos" com APIs de uso geral referentes a vários indicadores financeiros.

https://dadosabertos.bcb.gov.br/

Vamos consumir a API referente a cotação do dólar, o link para você consultar as opções disponíveis é este:

https://bit.ly/2KKXKuy

Será necessário informar:

1 - O serviço que desejamos utilizar

2 - Uma data no formato mês-dia-ano.

3 - O formato da resposta. Por padrão a resposta é uma string no formato JSON.

Um exemplo de como acessar:

https://olinda.bcb.gov.br/olinda/servico/PTAX/versao/v1/odata/CotacaoDolarDia(dataCotacao=@dataCotacao)?@dataCotacao='11-21-2019'&$format=json

Para fazer a comunicação, utilizamos uma instância do objeto XMLHttpRequest.

let request = new XMLHttpRequest();

request.open('GET', minha_url, true);

request.send();

O primeiro parametro é o método de comunicação (GET ou POST) e o segundo é a URL que vamos acessar.

Feita a conexão, o objeto request passa a armazenar o resultado da conexão.

O objeto request tem um método chamado "onload", que vai ser chamado quando houver um retorno.

Vamos verificar se houve a conexão com sucesso. Para isso o objeto request possui um método chamado "readyState", que retorna um número inteiro com o resultado da conexão. As respostas possíveis são:

0 - UNSENT - Um cliente foi criado. Mas o método open() não foi chamado ainda.

1 - OPENED - O método open() foi chamado.

2 - HEADERS_RECEIVED - O método send() foi chamado e os cabeçalhos e status estão disponíveis .

3 - LOADING - Baixando e responseText contem os dados parciais.

4 - DONE - Operação concluída.

Se a operação estiver concluída, vamos receber o status HTTP da requisição. Precisamos receber um status HTTP de código 200, que é o status recebido quando é enviada uma resposta sem erros.

request.onload = function() {

    if (request.readyState == 4 && request.status == 200) {

//Sucesso

}

}

Os dados recebidos da API ficam disponívels no método responseTexT. Devemos converter este texto num objeto JSON.

console.log(JSON.parse(request.responseText));

Um exemplo de conteúdo:

{"@odata.context":"https://was-p.bcnet.bcb.gov.br/olinda/servico/PTAX/versao/v1/odata$metadata#_CotacaoDolarDia",

"value":[{"cotacaoCompra":4.20060,"cotacaoVenda":4.20120,"dataHoraCotacao":"2019-11-21 13:03:40.946"}]}

Dentro deste JSON, existe um array de objetos dentro do campo "value". Como fizemos o filtro por 1 data, o array vai ter apenas uma posição.

var resposta = JSON.parse(request.responseText);

var valores = resposta.value[0];

Agora será possível recuperar a informação da cotação do dólar:

console.log(valores.cotacaoCompra);

console.log(valores.cotacaoVenda);

console.log(valores.dataHoraCotacao);

Segue abaixo o código completo:

var url = "https://olinda.bcb.gov.br/olinda/servico/PTAX/versao/v1/odata/CotacaoDolarDia(dataCotacao=@dataCotacao)?@dataCotacao='11-21-2019'&$format=json";

let request = new XMLHttpRequest();

request.open('GET', url, true);

request.onload = function() {

if (request.readyState == 4 && request.status == 200) {

var resposta = JSON.parse(request.responseText);

var valores = resposta.value[0];

console.log(valores.cotacaoCompra);

console.log(valores.cotacaoVenda);

console.log(valores.dataHoraCotacao);

} 

};

request.onerror = function() {

          console.log("Erro:"+request);

};

request.send();