CODEWITHSUNDEEP
javascriptyoutube-apifetch
Kevin H.
Kevin H.

Reputation: 348

YouTube API Fetch sends Response, but I cannot access Items

Other questions on the issue I've encountered seem to center on having an incorrect key, but I think I have that covered and now I'm stumped . . . is it the issue with YouTube API or the fetch()?

In simplified terms I'm sending: 

export function loadVideo() {
  fetch("https://www.googleapis.com/youtube/v3/search?part=snippet&maxResults=25&order=relevance&q=WOODYGUTHRIE&topicId=%2Fm%2F04rlf&type=video&videoCaption=any&key=MYKEY")
    .then(function (response) {
      console.log(queryString);
      console.log(response);
    })
    .catch(err => console.log(err));
  console.log(videoList);
}

And just looking at my logs, that query string will load the JSON I want in my browser just fine, and logging the response itself gives me:

Response {type: "cors", url: "https://www.googleapis.com/youtube/v3/search?part=…n=any&key=MYKEY", redirected: false, status: 200, ok: true, …}
body: (...)
bodyUsed: false
headers: Headers {}
ok: true
redirected: false
status: 200
statusText: ""
type: "cors"
url: "https://www.googleapis.com/youtube/v3/search?part=snippet&maxResults=25&order=relevance&q=WOODYGUTHRIE&topicId=%2Fm%2F04rlf&type=video&videoCaption=any&key=MYKEY"
__proto__: Response

BUT anyway I slice it, response.items, response.body.items, response.data.items, I get undefined. So I'm grasping at straws and can't see a clear path in my troubleshooting yet.

What am I overlooking?

Upvotes: 0

Views: 177

Answers (2)

Steve K
Steve K

Reputation: 9065

You need to use json() to allow javascript to be able to parse through it so it should probably be something like the following: 

export function loadVideo() {
  fetch("https://www.googleapis.com/youtube/v3/search?part=snippet&maxResults=25&order=relevance&q=WOODYGUTHRIE&topicId=%2Fm%2F04rlf&type=video&videoCaption=any&key=MYKEY")
  .then(response => response.json())
  .then(result => {
    //Do something with the result like
    console.log(result.items)
  });  
}

Upvotes: 2

user5386938
user5386938

Reputation:

The examples show the response should have a videos field as a list/array. Can you check if your response object has such a field?

Upvotes: 0

Related Questions