Как получить фактические данные из ответа? Я получаю неопределенным

Question

Я пытаюсь получить данные из API YELP,

У меня есть функция извлечения, которая выглядит следующим образом:

export function fetchRestaurants (term) {
    const endpoint = `businesses/search?term=${term}&location=NYC`

    return fetch(endpoint, {
      headers: new Headers({
        'Authorization': 'Bearer '+'oSJvaTmFtYVCEJcMsLFA4uRljDOILtEfp0sTWflSWclozapMP1rCZ6uttKPOoYnrdUGcTXI0ztOf3rTPVSBRa1JjngqcoTKD30YUp7yKxhZCNzS4bsZV_DqzzkAwXXYx',
      }), 
    })
      .then((res) => {
        console.log(res)
        res.json()
      })
      .then((data) => {
        console.log(data)
        // this is undefined!
        return data
      })
  }

Respose 200 на первом then и выглядит так:

Response {type: "basic", url: "http://localhost:3000/businesses/search?term=pizza&location=NYC", redirected: false, status: 200, ok: true, …}
type: "basic"
url: "http://localhost:3000/businesses/search?term=pizza&location=NYC"
redirected: false
status: 200
ok: true
statusText: "OK"
headers: Headers {}
body: (...)
bodyUsed: true

Но затем я пытаюсь сделать .json для него на втором then, и когда я пытаюсь зарегистрировать его, оно не определено.

Любые идеи о том, как получить фактические данные? Спасибо

Answer 1

Первая .then функция обратного вызова должна вернуть res.json() Как это:

.then((res) => {
    console.log(res)
    return res.json()
  })