Requisição

Olá, Leonardo.

Não sou o Flavio. Sorry!

Mas é possível sim. Você já tem a url da API que você quer consumir? Se tiver, posso te ajudar :-)

É uma api do Dribbble http://developer.dribbble.com/v1/ No caso eu teria que consumir essa api e exibir os shots mais populares do dribbble. Esse é um caso específico, mas eu sempre quis entender melhor como esse mecanismo de consumo de api's funciona. Agradeço.

Oi Leonardo, estudando muito?

Como o Marco já disse, é possível consumir API de terceiros usando a mesma estrutura aprendida no curso. No entanto, a API do dribble requer autenticação usando um fluxo chamado OAuth até onde eu li na documentação rapidamente.

Por essa exigência, a API se torna mais complexa para ser consumida, pois você precisa enviar credenciais e executar os passos cadastrados nessa API. Aliás, esses passos são parecidos quando se usa OAuth, porém cada API tem seus detalhes.

Talvez essa não seja uma API indica para começar a se integrar com outras API's justamente por esse requerimento de autenticação.

Como o Marco se propôs a ajudá-lo, talvez ela tenha um jogo de cintura melhor do que eu para poder entrar nos detalhes de consumo da API.

Aliás, Marco, sabe de alguma API na qual não seja necessário autenticação para indicar para o aluno? Eu não lembro uma de cabeça.

Tranquilo Leonardo?

Opa! Lembrei de algo interessante. Você pode tentar o http://www.mocky.io/.

Lá você pode criar uma API que devolve um JSON fixo e ficar brincando através de requisições Ajax. Inclusive isso mostrará detalhes de headers e algumas coisas que talvez possa agregar em seu conhecimento.

Onde esta escrito body, você coloca qualquer objeto JavaScript válido, ou até mesmo um array com objetos. Mas cuidado, as chaves e os valores, quanto string, devem vir entre aspas duplas, exigência.

Veja um exemplo de body que retorna um objeto:

{
    "nome": "Flávio"
}

Agora um que retorna uma lista:

[
{
    "nome": "Flávio"
},
{
    "nome": "Leo"
},
]

Depois de preencher, clique em Gerar minha resposta HTTP. Dai lá no topo, ele montará uma URL temporária para você exercitar.

Perfeito, professor. Muito obrigado pela dica. Vou começar imediatamente.

Oi Leo, atualizei a mensagem anterior para orientá-lo melhor como fazer o teste.

Você ainda esta no módulo 2, no módulo 3 aprenderá a fazer requisição Ajax mais fácil. Por exemplo, quando criar a URL no seu browser lá.. se quiser testar rapidamente no console faça:

fetch('http://www.mocky.io/v2/58c8457427000069182bb298').then(res => res.json()).then(dado => console.log(dado));

No caso, você coloca o endereço que ele gerou. Não fique impressionado com esse código ainda, é só para você testar. No módulo 3 você aprende a se livrar do XMLHttprequest!

Flavio sem mandando bem. Acho que não preciso acresentar mais nada :-)

Estava mesmo tentando decifrar esse body rsrs. Obrigado, professor. Estou cada vez mais perto de me tornar um cangaceio em JS graças a vcs :)

Então, preenche os dados, clique em gerar.. e pega o código abaixo e cola no console do seu navegador para ver o resultado (eu atualizei o post anterior com essa instrução).

fetch('http://www.mocky.io/v2/58c8457427000069182bb298').then(res => res.json()).then(dado => console.log(dado));

Tem que imprimir no console do seu navegador o dado que você escreveu em body. Se gostou do fetch, chegue até o terceiro curso avançado que você vai aprender. Depois e diz se funcionou.

Ai..vc no seu código..usa o XHMLHTTP REQUEST para consumir o endereço da API.

Opa, voltei. O colega aqui da Alura deu a dica desse:

https://jsonplaceholder.typicode.com/

Há uma série de URL já pronta que retorna objetos, lista de objetos. Também é legal para você ficar consumindo e aprender a lidar com a resposta.

Sucesso e bom estudo!

Funcionou perfeitamente, professor. Adorei as dicas. Muitíssimo obrigado aos dois.