2

Tenho o seguinte link para acessar:

https://www.googleapis.com/youtube/v3/search?part=snippet&maxResults=5&q=brksedu&key={YOUR_API_KEY}

Quando acessado diretamente ele retorna um array assim:

{
 "kind": "youtube#searchListResponse",
 "etag": "\"I_8xdZu766_FSaexEaDXTIfEWc0/Y3YIz5M5plLC7zcRxibBlX47-aU\"",
 "nextPageToken": "CAIQAA",
 "regionCode": "BR",
 "pageInfo": {
  "totalResults": 159704,
  "resultsPerPage": 2
 },
 "items": [
  {
   "kind": "youtube#searchResult",
   "etag": "\"I_8xdZu766_FSaexEaDXTIfEWc0/UDOCuqtHTALjQUfIUcgkxYCRNPg\"",
   "id": {
    "kind": "youtube#channel",
    "channelId": "UCWKtHaeXVzUscYGcm0hEunw"
   },
   "snippet": {
    "publishedAt": "2010-07-30T02:06:06.000Z",
    "channelId": "UCWKtHaeXVzUscYGcm0hEunw",
    "title": "BRKsEDU",
    "description": "Canal de gameplays e vlogs de games e entretenimento! Ou seja: tenho o melhor trabalho do mundo! =) Jogos favoritos: Life Is Strange, Shadow of the ...",
    "thumbnails": {
     "default": {
      "url": "https://yt3.ggpht.com/-4VkVjXuRhlU/AAAAAAAAAAI/AAAAAAAAAAA/MtEHi_HPB5E/s88-c-k-no-mo-rj-c0xffffff/photo.jpg"
     },
     "medium": {
      "url": "https://yt3.ggpht.com/-4VkVjXuRhlU/AAAAAAAAAAI/AAAAAAAAAAA/MtEHi_HPB5E/s240-c-k-no-mo-rj-c0xffffff/photo.jpg"
     },
     "high": {
      "url": "https://yt3.ggpht.com/-4VkVjXuRhlU/AAAAAAAAAAI/AAAAAAAAAAA/MtEHi_HPB5E/s240-c-k-no-mo-rj-c0xffffff/photo.jpg"
     }
    },
    "channelTitle": "BRKsEDU",
    "liveBroadcastContent": "upcoming"
   }
  },
  {
   "kind": "youtube#searchResult",
   "etag": "\"I_8xdZu766_FSaexEaDXTIfEWc0/iFm3mPRQQ_2agP1yM-gTXXMIzlk\"",
   "id": {
    "kind": "youtube#video",
    "videoId": "uIMfeKEyOCE"
   },
   "snippet": {
    "publishedAt": "2016-09-25T14:48:40.000Z",
    "channelId": "UCWKtHaeXVzUscYGcm0hEunw",
    "title": "FORZA HORIZON 3 #5 - Correndo Contra um Trem!? (PC Gameplay)",
    "description": "Vídeo gameplay do jogo Forza Horizon 3, game exclusivo Microsoft disponível para Xbox One e PC. Forza Horizon 3 está disponível dublado e legendado em ...",
    "thumbnails": {
     "default": {
      "url": "https://i.ytimg.com/vi/uIMfeKEyOCE/default.jpg",
      "width": 120,
      "height": 90
     },
     "medium": {
      "url": "https://i.ytimg.com/vi/uIMfeKEyOCE/mqdefault.jpg",
      "width": 320,
      "height": 180
     },
     "high": {
      "url": "https://i.ytimg.com/vi/uIMfeKEyOCE/hqdefault.jpg",
      "width": 480,
      "height": 360
     }
    },
    "channelTitle": "BRKsEDU",
    "liveBroadcastContent": "none"
   }
  }
 ]
}

Minha pergunta é: Como acessar essa url com ajax e pegar os elementos do retorno. Por exemplo, quero pegar o channelTitle. Obrigado!!!

1

1 Resposta 1

2

Código:

success : function(data) {

    var jsonData = JSON.parse(data);

    var items_length = jsonData.items.length;
    var items = jsonData.items;

    for (var i=0; i < items_length; i++){
        console.log(items[i].snippet.channelTitle);
    }
}

Resposta:

Se a requisição foi bem sucedida será retornado o status da requisição HTTP igual a 200 OK para o AJAX e o método success será chamado com os dados em formato JSON (o mesmo que você colocou acima).

Iremos converter o JSON que foi recebido para atributos JavaScript com a instrução JSON.parse(data) para que a gente possa acessar o objeto e seus atributos.

E no final iremos tratar e iterar o objeto e seus atributos recuperando e colocando no console do navegador o valor do atributo channelTitle dos itens que vieram a partir da requisição.

Exemplo e execução:

Você pode com seu navegador favorito abrir o exemplo que criei no JSFiddle clicando aqui, abrir o console do seu navegador e executar o exemplo sendo possível ver o atributo channelTitle dos itens sendo printados no console de seu navegador. No meu caso não precisei converter uma String com um JSON dentro para um objeto JavaScript utilizando a instrução JSON.parse porque já atribui um objeto JavaScript na variável conteudo.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .